| <template> | 
|   <GlobalWindow | 
|     :title="title" | 
|     :visible.sync="visible" | 
|     :confirm-working="isWorking" | 
|     @confirm="confirm" | 
|   > | 
|     <el-form :model="form" ref="form" :rules="rules"> | 
|       <el-form-item label="上级部门" prop="parentId"> | 
|         <DepartmentSelect v-if="visible" ref="departmentSelect" placeholder="请选择上级部门" v-model="form.parentId" :exclude-id="excludeDeptId" :inline="false"/> | 
|       </el-form-item> | 
|       <el-form-item label="部门编码" prop="code" required> | 
|         <el-input v-model="form.code" placeholder="请输入部门编码" v-trim maxlength="50"/> | 
|       </el-form-item> | 
|       <el-form-item label="部门名称" prop="name" required> | 
|         <el-input v-model="form.name" placeholder="请输入部门名称" v-trim maxlength="50"/> | 
|       </el-form-item> | 
|       <el-form-item label="联系电话" prop="phone"> | 
|         <el-input v-model="form.phone" placeholder="请输入联系电话" v-trim maxlength="11"/> | 
|       </el-form-item> | 
|       <el-form-item label="部门邮箱" prop="email"> | 
|         <el-input v-model="form.email" placeholder="请输入部门邮箱" v-trim maxlength="200"/> | 
|       </el-form-item> | 
|     </el-form> | 
|   </GlobalWindow> | 
| </template> | 
|   | 
| <script> | 
| import BaseOpera from '@/components/base/BaseOpera' | 
| import GlobalWindow from '@/components/common/GlobalWindow' | 
| import DepartmentSelect from '@/components/common/DepartmentSelect' | 
| import { checkMobile, checkEmail } from '@/utils/form' | 
| export default { | 
|   name: 'OperaDepartmentWindow', | 
|   extends: BaseOpera, | 
|   components: { DepartmentSelect, GlobalWindow }, | 
|   data () { | 
|     return { | 
|       // 需排除选择的部门ID | 
|       excludeDeptId: null, | 
|       // 表单数据 | 
|       form: { | 
|         id: null, | 
|         parentId: null, | 
|         code: '', | 
|         name: '', | 
|         phone: '', | 
|         email: '' | 
|       }, | 
|       // 验证规则 | 
|       rules: { | 
|         code: [ | 
|           { required: true, message: '请输入部门编码' } | 
|         ], | 
|         name: [ | 
|           { required: true, message: '请输入部门名称' } | 
|         ], | 
|         phone: [ | 
|           { validator: checkMobile } | 
|         ], | 
|         email: [ | 
|           { validator: checkEmail } | 
|         ] | 
|       } | 
|     } | 
|   }, | 
|   methods: { | 
|     /** | 
|      * @title 窗口标题 | 
|      * @target 编辑的部门对象 | 
|      * @parent 新建时的上级部门对象 | 
|      * @departmentList 部门列表 | 
|      */ | 
|     open (title, target, parent) { | 
|       this.title = title | 
|       this.visible = true | 
|       // 新建 | 
|       if (target == null) { | 
|         this.excludeDeptId = null | 
|         this.$nextTick(() => { | 
|           this.$refs.form.resetFields() | 
|           this.form.id = null | 
|           this.form.parentId = parent == null ? null : parent.id | 
|         }) | 
|         return | 
|       } | 
|       // 编辑 | 
|       this.$nextTick(() => { | 
|         this.excludeDeptId = target.id | 
|         for (const key in this.form) { | 
|           this.form[key] = target[key] | 
|         } | 
|       }) | 
|     } | 
|   }, | 
|   created () { | 
|     this.config({ | 
|       api: '/system/department' | 
|     }) | 
|   } | 
| } | 
| </script> |