部门新增修改对接

package.json

@@ -15,6 +15,7 @@
     "@riophae/vue-treeselect": "^0.4.0",
     "axios": "0.24.0",
     "clipboard": "2.0.8",
+    "core-js": "^3.36.1",
     "countup.js": "2.0.8",
     "cropperjs": "^1.5.13",
     "dingtalk-jsapi": "^3.0.20",

src/utils/request.js

@@ -20,7 +20,6 @@ const service = axios.create({
 // 添加请求拦截器
 service.interceptors.request.use(
 	(config) => {
-		console.log('---------------------')
 		// 是否需要设置 token
 		const isToken = (config.headers || {}).isToken === false
 		let  getToken = Session.get('token');
@@ -38,7 +37,6 @@ service.interceptors.request.use(
 // 添加响应拦截器
 service.interceptors.response.use(
 	(res) => {
-		console.log(res)
 		// 对响应数据做点什么
 		const response = res.data;
 		const code = res.data.code || 200;
@@ -70,14 +68,14 @@ service.interceptors.response.use(
 			}
 	},
 	(error) => {
-		console.log(error.response.error) // 获取错误状态码
+		console.log(error.response.data.errMessage ) // 获取错误状态码
 		// 对响应错误做点什么
 		if (error.message.indexOf('timeout') != -1) {
 			Message.error('网络超时');
 		} else if (error.message == 'Network Error') {
 			Message.error('网络连接错误');
 		} else {
-			Message.error(error.response.data.msg || error.response.data.error);
+			Message.error( error.response.data.msg || error.response.data.error ||error.response.data.errMessage);
 		}
 		return Promise.reject(error);
 	}

src/views/classList/classList/api.js

@@ -15,6 +15,43 @@ export function getClassStudent  (classId, params) {
         params
     })
 }
+// 校区学段年级班级新增
+export function postManager  (data) {
+    return request({
+        url: `/manager/class`,
+        method: 'post',
+        data
+    })
+}
+// 校区学段年级班级修改
+export function putManager  (data) {
+    return request({
+        url: `/manager/class`,
+        method: 'put',
+        data
+    })
+}
 
 
+// 校区学段年级班级删除
+export function deleteManager  (id) {
+    return request({
+        url: `/manager/class`,
+        method: 'delete',
+        params:{
+            id
+        }
+    })
+}
+// 班级家长信息
+export function getGuardian  (classId, studentId) {
+    return request({
+        url: `/manager/class/guardian/list`,
+        method: 'get',
+        params:{
+            classId,studentId
+        }
+    })
+}
+
 

src/views/classList/classList/index.vue

@@ -13,25 +13,35 @@
         ></el-tree>
         <div class="add-box">
           <div class="add-list">
-            <el-button @click="isAddDialog = true; addNum = 1" size="medium" class="el-icon-plus">新增班级</el-button>
+            <el-button @click="isAddDialog = true; addNum = 1; resetSchoolForm()" size="medium" class="el-icon-plus">新增班级</el-button>
           </div>
           <div class="add-list">
-            <el-button @click="isAddDialog = true; addNum = 2" size="medium" class="el-icon-plus">新增年级</el-button>
+            <el-button @click="isAddDialog = true; addNum = 2;resetSchoolForm()" size="medium" class="el-icon-plus">新增年级</el-button>
           </div>
           <div class="add-list">
-            <el-button @click="isAddDialog = true; addNum = 3" size="medium" class="el-icon-plus">新增学段</el-button>
+            <el-button @click="isAddDialog = true; addNum = 3;resetSchoolForm()" size="medium" class="el-icon-plus">新增学段</el-button>
           </div>
           <div class="add-list">
-            <el-button @click="isAddDialog = true; addNum = 4" size="medium" class="el-icon-plus">新增校区</el-button>
+            <el-button @click="isAddDialog = true; addNum = 4;resetSchoolForm()" size="medium" class="el-icon-plus">新增校区</el-button>
           </div>
         </div>
       </div>
     </div>
     <div class="form-adapt-container">
         <el-card shadow="hover">
-          <h4>{{ classData.className}}</h4>
+          <!-- <h4>{{ classData.className}}</h4> -->
+          <div style="display: flex;">
+            <div  style="margin-right: 10px; font-size: 16px; line-height: 27px; font-weight: 700;">{{ nodeData.className }}</div>
+            <!-- <div  v-else style="margin-right: 10px; font-size: 16px;  line-height: 27px;font-weight: 700;">{{ classData.className}}</div> -->
+            <el-button @click="onClickUpdate" v-if="nodeData.className" size="mini" type="warning" class="el-icon-edit">修改名称</el-button>
+            <el-button @click="onClickRemove"  v-if="nodeData.className" size="mini" type="danger" class="el-icon-delete">删除</el-button>
+          </div>
         </el-card>
         <el-card shadow="hover" style=" margin-top: 20px;" >
+          <div style="margin-bottom: 10px;">
+            <el-button type="primary">添加学生</el-button>
+
+          </div>
           <el-table
             :data="studentArr"
             :row-style="{ height: '50px' }"
@@ -57,12 +67,13 @@
           @clickSize="onClickSize"
         />
     </div>
+    <!-- 新增 -->
     <el-dialog
       :title="addEnum[addNum]"
       :visible.sync="isAddDialog"
       width="30%">
       <el-form ref="schoolForm" :model="schoolForm" label-width="80px">
-        <el-form-item label="校区">
+        <el-form-item v-if="addNum < 4" label="校区">
           <el-select  @change="onChangeSchool" v-model="schoolForm.school" placeholder="请选择校区">
             <el-option v-for="item in organizeArr" :label="item.className" :value="item.classId"></el-option>
           </el-select>
@@ -82,29 +93,35 @@
             <el-option v-for="item in classArr" :label="item.className" :value="item.classId"></el-option>
           </el-select>
         </el-form-item>
-        <el-form-item v-if="addNum == 4"  :label="'校区名称'">
+        
-          <el-input ></el-input>
+        <el-form-item  :label="labelEnum[addNum]+'名称'">
+          <el-input v-model="schoolForm.name"></el-input>
         </el-form-item>
-        <el-form-item v-if="addNum == 3"  :label="'学段名称'">
+        <el-form-item  label="排序">
-          <el-input ></el-input>
+          <el-input v-model="schoolForm.sort" placeholder="数值越小越靠前（选填）"></el-input>
         </el-form-item>
-        <el-form-item v-if="addNum == 2"  :label="'年级名称'">
+      </el-form>
-          <el-input ></el-input>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="isAddDialog = false">取 消</el-button>
+        <el-button type="primary" @click="onClickAffirm">确 定</el-button>
+      </span>
+    </el-dialog>
+    <el-dialog
+      title="修改名称"
+      :visible.sync="isUpdateDialog"
+      width="30%">
+      <el-form ref="updateForm" :model="updateForm" label-width="80px">
+        <el-form-item  :label="'名称'">
+          <el-input v-model="updateForm.name"></el-input>
         </el-form-item>
-        <el-form-item v-if="addNum == 1"  :label="'班级名称'">
+        <el-form-item  :label="'排序'">
-          <el-input ></el-input>
+          <el-input v-model="updateForm.sort" placeholder="数值越小越靠前"></el-input>
         </el-form-item>
       </el-form>
       
-      <!-- <el-form ref="schoolForm" :model="schoolForm" label-width="80px">
-        <el-form-item   :label="'分段名称'">
-          <el-input ></el-input>
-        </el-form-item>
-      </el-form> -->
-
       <span slot="footer" class="dialog-footer">
-        <el-button @click="isAddDialog = false">取 消</el-button>
+        <el-button @click="isUpdateDialog = false">取 消</el-button>
-        <el-button type="primary" @click="isAddDialog = false">确 定</el-button>
+        <el-button type="primary" @click="onClickAffirmUpdate">确 定</el-button>
       </span>
     </el-dialog>
   </div>
@@ -112,7 +129,7 @@
 
 <script>
 import columns from "./columns";
-import { getClass, getClassStudent } from "./api";
+import { getClass, getClassStudent, postManager, putManager, deleteManager, getGuardian } from "./api";
 import { formatDate } from "@/com/index";
 import CommonHead from './components/CommonHead.vue'
 
@@ -133,6 +150,7 @@ export default {
       loading: false,
       equipmentList: [],
       dialogVisible: false,
+      
       organizeArr: [], // 校区班级列表
       studentArr: [],// 学生列表
       classData: {
@@ -148,8 +166,13 @@ export default {
       gradeArr: [], // 年级数据
       classArr: [], // 班级数据
       addEnum: ['', '新增班级', '新增年级', '新增学段', '新增校区'],
-      form: {
+      labelEnum: ['', '班级', '年级', '学段', '校区'],
-        
+      form: { },
+      nodeData: '', // 选中的节点
+      isUpdateDialog: false, // 修改弹框
+      updateForm: { // 修改信息
+        superId: '',
+        name: ''
       }
     };
   },
@@ -160,14 +183,82 @@ export default {
     this.classList()
     const defaultCheckClass= localStorage.getItem('defaultCheckClass')  // 设置之前选中了班级
     if(defaultCheckClass){
-      this.classData = JSON.parse(defaultCheckClass) 
+      this.nodeData = JSON.parse(defaultCheckClass) 
-      this.defaultCheckedKeys = [this.classData.classId]
+      this.defaultCheckedKeys = [this.nodeData.classId]
-      this.studentList(this.classData.classId)
+      this.studentList(this.nodeData.classId)
     }
   },
   mounted () {
   },
   methods: {
+    // 点击确定修改
+    onClickAffirmUpdate() {
+      putManager(this.updateForm).then(res =>{
+        this.classList();
+        this.$message.success('修改成功')
+        this.isUpdateDialog = false
+      })
+    },
+    // 点击修改按钮
+    onClickUpdate() {
+      this.updateForm = {}
+      if(this.nodeData){ // 说明点击过节点
+        this.isUpdateDialog = true
+        this.updateForm = {
+          classId: this.nodeData.classId,
+          name: this.nodeData.className,
+          sort: this.nodeData.sort
+        }
+      }
+    },
+    onClickRemove () {
+      this.$confirm(`删除包含下级所以数据，确定要删除${this.nodeData.className}吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          deleteManager(this.nodeData.classId).then(res => {
+            this.classList();
+            this.$message({ type: 'success',  message: '删除成功!'  });
+            this.nodeData = ''
+          })
+        }).catch(() => {
+          this.$message({ type: 'info',  message: '已取消删除' });          
+        });
+    },
+    // 点击确认新增
+    onClickAffirm() {
+      // const { school, phase, grade, name } = this.schoolForm;
+      const errorMessages = {
+        school: '请选择校区',
+        phase: '请选择学段',
+        grade: '请选择年级',
+        name: '请输入'+ this.labelEnum[this.addNum] + '名称',
+     };
+     const requiredFields = {
+      1: ['school', 'phase', 'grade', 'name'],
+      2: ['school', 'phase', 'name', ],
+      3: ['school', 'name', ],
+      4: ['name'],
+     }
+     // 过滤必填未填写的字段
+     const missingFields = requiredFields[this.addNum].filter(field => !this.schoolForm[field]);
+     if(missingFields.length === 0){ // 判断必填项是否填写
+      let obj = { name: this.schoolForm.name, superId: 0, sort: this.schoolForm.sort }
+      if(this.addNum !== 4 ){
+        let len = requiredFields[this.addNum].length
+        obj.superId = this.schoolForm[requiredFields[this.addNum][len-2]]
+      }
+      // 提交
+      postManager(obj).then(res =>{
+        this.classList();
+        this.$message.success('新增成功');
+        this.isAddDialog = false
+      });
+     }else { // 未填写信息提示
+      this.$message.error(errorMessages[missingFields[0]]);
+     }
+    },
     // 选择校区
     onChangeSchool(value) {
       this.phaseArr = this.organizeArr.find( item => item.classId == value).childrenList
@@ -178,21 +269,23 @@ export default {
     },
     // 选择年级
     onChangeGrade(value) {
-      console.log(this.gradeArr)
-      console.log(value)
       this.classArr = this.gradeArr.find( item => item.classId == value).childrenList
-      console.log(this.classArr)
     },
     handleNodeClick(item) {
+      this.nodeData = item
+      // localStorage.setItem('defaultCheckClass', JSON.stringify(item) )
       if(item.childrenList.length === 0 && item.classId !== this.classData.classId) {
         this.studentList(item.classId)
         this.classData = item
-        localStorage.setItem('defaultCheckClass', JSON.stringify(this.classData) )
+      }else {
+        this.classData = ''
+        this.studentList(item.classId)
       }
     },
     // 班级列表
     classList(){
       getClass().then( res =>{
+        this.nodeData.classId ? this.defaultCheckedKeys = [this.nodeData.classId] : ''
         this.organizeArr = res
       })
     },
@@ -213,6 +306,13 @@ export default {
       this.query.size = val;
       this.studentList(this.classData.classId);
     },
+    // 重置班级年级下拉数据
+    resetSchoolForm() {
+      this.schoolForm = {}
+      this.phaseArr = []
+      this.gradeArr = []
+      this.classArr = []
+    }
     
   },
 };

src/views/department/api.js

@@ -1,20 +1,46 @@
 import request from '@/utils/request';
 
 // 获取部门列表
-export function getClass  () {
+export function getDept  () {
     return request({
         url: '/manager/dept/list',
         method: 'get',
     })
 }
 // 获取部门用户列表
-export function getClassStudent  (deptId, params) {
+export function getDeptUser  (deptId, params) {
     return request({
         url: `/manager/user/list/${deptId}`,
         method: 'get',
         params
     })
 }
+// 新增部门
+export function postDept  (data) {
+    return request({
+        url: `/manager/dept`,
+        method: 'POST',
+        data
+    })
+}
+// 修改部门
+export function putDept  (data) {
+    return request({
+        url: `/manager/dept`,
+        method: 'PUT',
+        data
+    })
+}
+// 删除部门
+export function deleteDept  (id) {
+    return request({
+        url: `/manager/dept`,
+        method: 'DELETE',
+        params:{
+            id
+        }
+    })
+}
 
 
 

src/views/department/index.vue

@@ -1,52 +1,135 @@
 <template>
   <div class="box">
     <div class="side-nav">
-      <h3>班级管理</h3>
+      <h3>部门管理</h3>
       <div>
-        <el-tree :data="classArr" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
+        <el-tree :data="deptArr"  node-key="deptId"
+          ref="areaTrees"
+          :default-expanded-keys="defaultCheckedKeys"
+          :default-checked-keys="defaultCheckedKeys"
+         accordion
+        :highlight-current="true"
+        :props="defaultProps" @node-click="handleNodeClick"
+        ></el-tree>
+        <div class="add-box">
+          <div class="add-list">
+            <el-button @click="isAddDialog = true; resetDeptForm()" size="medium" class="el-icon-plus">新增部门</el-button>
+          </div>
+        </div>
       </div>
     </div>
     <div class="form-adapt-container">
         <el-card shadow="hover">
-          <h4>{{ classData.className}}</h4>
+          <!-- <h4>{{ classData.name}}</h4> -->
+          <div style="display: flex;">
+            <div  style="margin-right: 10px; font-size: 16px; line-height: 27px; font-weight: 700;">{{ deptData.name }}</div>
+            <!-- <div  v-else style="margin-right: 10px; font-size: 16px;  line-height: 27px;font-weight: 700;">{{ classData.name}}</div> -->
+            <el-button @click="onClickUpdate" v-if="deptData.name" size="mini" type="warning" class="el-icon-edit">修改部门</el-button>
+            <el-button @click="onClickRemove"  v-if="deptData.name" size="mini" type="danger" class="el-icon-delete">删除</el-button>
+          </div>
         </el-card>
-           
         <el-card shadow="hover" style=" margin-top: 20px;" >
+          <div style="margin-bottom: 10px;">
+            <el-button type="primary">添加人员</el-button>
+
+          </div>
           <el-table
-            :data="studentArr"
+            :data="userArr"
             :row-style="{ height: '50px' }"
             border
             >
-            <el-table-column label="学生姓名" prop="name"></el-table-column>
+            <el-table-column label="照片" prop="faceImg">
-            <el-table-column label="学生照片" prop="faceImg">
               <template slot-scope="scope">
                 <img  :src="scope.row.faceImg" alt="" style="width: 100px; height: 100px;">
               </template>
             </el-table-column>
-            <el-table-column label="家长姓名" prop="name"></el-table-column>
+            <el-table-column label="姓名" prop="name"></el-table-column>
-            <el-table-column label="手机号" prop="name"></el-table-column>
+            <el-table-column label="性别" prop="gender"></el-table-column>
+            <el-table-column label="手机号" prop="mobile"></el-table-column>
+            <el-table-column label="头像" prop="avatar">
+              <template slot-scope="scope">
+                <img  :src="scope.row.avatar" alt="" style="width: 100px; height: 100px;">
+              </template>
+            </el-table-column>
+            <el-table-column label="权限" prop="roleName"></el-table-column>
+
 
           </el-table> 
 
         </el-card>
-        <Pagination
+        <!-- <Pagination
           :total="total"
           :pageNum="query.current"
           :pageSize="query.size"
           @clickCurrent="onClickCurrent"
           @clickSize="onClickSize"
-        />
+        /> -->
     </div>
+    <!-- 新增部门 -->
+    <el-dialog
+      title="新增部门"
+      :visible.sync="isAddDialog"
+      width="30%">
+      <el-form ref="deptForm" :model="deptForm" label-width="80px">
+        <el-form-item  label="部门级别" prop="resource">
+          <el-radio-group @change="onChangeRadio" v-model="resource">
+            <el-radio :label="1">一级部门</el-radio>
+            <el-radio :label="2">其他级别</el-radio>
+          </el-radio-group>
+
+        </el-form-item>
+        <el-form-item v-if="resource === 2" label="上级部门" prop="parentId">
+          <Treeselect v-model="deptForm.parentId" :options="deptArr" :normalizer="normalizer" placeholder="选择上级部门" />
+          </el-form-item>
+        <el-form-item  label="部门名称">
+          <el-input v-model="deptForm.name" placeholder="请输入部门名称"></el-input>
+        </el-form-item>
+        <el-form-item  label="排序">
+          <el-input v-model="deptForm.sort" type="number" placeholder="数值越小越靠前" ></el-input>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="isAddDialog = false">取 消</el-button>
+        <el-button type="primary" @click="onClickAffirm">确 定</el-button>
+      </span>
+    </el-dialog>
+    <!-- 修改部门 -->
+    <el-dialog
+      title="新增部门"
+      :visible.sync="isUpdateDialog"
+      width="30%">
+      <el-form ref="deptUpdateForm" :model="deptUpdateForm" label-width="80px">
+        <!-- <el-form-item v-if="deptData.parentId !== '0'" label="上级部门" prop="parentId">
+          <Treeselect v-model="deptUpdateForm.parentId" :options="deptArr" :normalizer="normalizer" placeholder="选择上级部门" />
+        </el-form-item> -->
+        <el-form-item  label="部门名称">
+          <el-input v-model="deptUpdateForm.name" placeholder="请输入部门名称"></el-input>
+        </el-form-item>
+        <el-form-item  label="排序">
+          <el-input v-model="deptUpdateForm.sort" type="number" placeholder="数值越小越靠前" ></el-input>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="isUpdateDialog = false">取 消</el-button>
+        <el-button type="primary" @click="onClickAffirmUpdate">确 定</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import columns from "./columns";
-import { getClass, getClassStudent } from "./api";
+import { getDept, getDeptUser, postDept, putDept, deleteDept } from "./api";
 import { formatDate } from "@/com/index";
 import CommonHead from './components/CommonHead.vue'
-
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+const errorMessages = {
+  name: '请输入部门名称',
+  sort: '请输入排序',
+};
 export default {
+  
   name: "deviceManagement",
   data() {
     return {
@@ -58,59 +141,153 @@ export default {
       },
       defaultProps: {
         children: 'childrenList',
-        label: 'className'
+        label: 'name'
       },
-      loading: false,
+     
-      equipmentList: [],
+      deptArr: [], // 校区班级列表
-      dialogVisible: false,
+      userArr: [],// 学生列表
-      classArr: [],
+      defaultCheckedKeys: [],
-      studentArr: [],// 学生列表
+      isAddDialog: false, // 新增弹框
-      classData: {}, // 选中的班级
+      isUpdateDialog: false, // 修改弹框
-      classId: {}, // 选中的班级
+      deptData: '', // 选中的节点
+      deptForm: {
+        name: '',
+        sort: '',
+        parentId: null,
+      }, // 新增部门表单
+      deptUpdateForm: {
+        name: '',
+        sort: '',
+        deptId: null, // 部门id
+      }, // 修改部门表单
+      resource: 1
     };
   },
   components: {
     CommonHead,
+    Treeselect 
+
   },
   async created() {
-    // this.query.superId = 851392899;
+    this.deptList()
-    // console.log(config)
+  },
-    // this.getAttendanceFormData();
+  mounted () {
-    // this.semesterList()
-    this.classList()
-    
   },
-  
   methods: {
-    handleNodeClick(item) {
+    
-      this.classData = item
+    normalizer(node) {
-      if(item.childrenList.length == 0) {
+      if (node.childrenList && !node.childrenList.length) {
-        this.studentList(item.classId)
+        return { id: node.deptId,  label: node.name,  };
-        this.classId = classId.classId
+      }else {
+        return { id: node.deptId, label: node.name, children: node.childrenList };
       }
     },
-    // 班级列表
+    handleNodeClick(item) {
-    classList(){
+      this.deptData = item
-      getClass().then( res =>{
+      // localStorage.setItem('defaultCheckClass', JSON.stringify(item) )
-        this.classArr = res
+        this.deptUserList(item.deptId)
+        this.deptData = item
+      console.log(this.deptData)
+    },
+    // 部门列表
+    deptList(){
+      getDept().then( res =>{
+        this.deptData.deptId ? this.defaultCheckedKeys = [this.deptData.deptId] : ''
+        this.deptArr = res
+        let arr = this.deptArr .flat(Infinity); 
+        console.log(arr)
       })
     },
-    // 获取班级学生列表
+    // 获取部门用户列表
-    studentList(classId){
+    deptUserList(deptId){
-      getClassStudent(classId, this.query).then( res =>{
+      getDeptUser(deptId, this.query).then( res =>{
-        this.studentArr = res.student
+        this.userArr = res
       })
     },
-    // 点击切换页数
+    // 点击确定修改
-    onClickCurrent(val) {
+    onClickAffirmUpdate() {
-      this.query.current = val;
+      let obj = { ...this.deptUpdateForm }
-      this.studentList(this.classId);
+      if(obj.name === ''){
+        this.$message.error(errorMessages.name);
+      }else if(obj.sort === ''){
+        this.$message.error(errorMessages.sort);
+      }else {
+        putDept(this.deptUpdateForm).then(res =>{
+          this.deptData.sort = obj.sort
+          this.deptData.name = obj.name
+          this.deptList();
+          this.$message.success('修改成功')
+          this.isUpdateDialog = false
+        })
+      }
     },
-    // 点击了每页页数
+    // 点击修改按钮
-    onClickSize(val) {
+    onClickUpdate() {
-      this.query.size = val;
+      this.resetDeptUpdateForm()
-      this.studentList(this.classId);
+      this.isUpdateDialog = true
+      // this.deptUpdateForm.deptId = this.deptData.deptId
+      if(this.deptData){ // 说明点击过节点
+        this.isUpdateDialog = true
+        this.deptUpdateForm = {
+          deptId: this.deptData.deptId,
+          name: this.deptData.name,
+          sort: this.deptData.sort
+        }
+      }
     },
+     // 点击确认新增
+     onClickAffirm() {
+      let obj = { ...this.deptForm }
+      if(this.resource === 1){ // 一级部门
+        obj.parentId = 0
+      }
+      if(obj.name === ''){
+        this.$message.error(errorMessages.name);
+      }else if(obj.sort === ''){
+        this.$message.error(errorMessages.sort);
+      }else if(this.resource === 2 && (obj.parentId === null|| obj.parentId === undefined|| obj.parentId === '')){
+        this.$message.error('请选择上级部门');
+      }else {
+        postDept(obj).then(res =>{
+          this.deptList();
+          this.$message.success('新增成功')
+          this.isAddDialog = false
+        })
+      }  
+    }, 
+    onClickRemove () {
+      this.$confirm(`删除包含下级所以数据，确定要删除${this.deptData.name}吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          deleteDept(this.deptData.deptId).then(res => {
+            this.deptList();
+            this.$message({ type: 'success',  message: '删除成功!'  });
+            this.deptData = ''
+          })
+        }).catch(() => {
+          this.$message({ type: 'info',  message: '已取消删除' });          
+        });
+    },
+    onChangeRadio() {
+      this.resetDeptForm()
+    },
+    resetDeptForm() {
+      this.deptForm = {
+        name: '',
+        sort: '',
+        parentId: null,
+      }
+    },
+    resetDeptUpdateForm() {
+      this.deptUpdateForm = {
+        name: '',
+        sort: '',
+        deptId: null,
+      }
+    }
+    
     
   },
 };
@@ -129,6 +306,13 @@ export default {
     h3{
       margin-bottom: 20px;
     }
+    .add-box{
+      padding: 5px;
+      box-sizing: border-box;
+      .add-list{
+        margin: 0 0 10px;
+      }
+    }
   }
   .form-adapt-container{
     flex: 1;
@@ -155,4 +339,6 @@ export default {
 .content::-webkit-scrollbar {
     width: 0; /* 设置滚动条的宽度 */
 }
+
+
 </style>

src/views/login/index.vue

@@ -146,6 +146,9 @@ export default {
     },
   },
   created() {
+    const paragraph = "I think Ruth's dog is cuter than your dog! Ruth";
+    console.log(paragraph.replace("Ruth", 'my'));
+
     this.initTime();
   },
   mounted() {