1

src/views/system/dept/index.vue

@@ -24,7 +24,7 @@
 					</el-col>
 					<el-col :span="24">
 						<el-form-item label="部门名称" prop="deptName">
-							<el-input v-model.trim="deptForm.deptName" placeholder="请输入部门名称" maxlength="20" show-word-limit />
+							<el-input v-model.trim="deptForm.deptName" placeholder="请输入部门名称" maxlength="20" show-word-limit @input="setShortList" />
 						</el-form-item>
 					</el-col>
 					<el-col :span="24">
@@ -32,7 +32,7 @@
 							<ul class="short">
 								<li v-for="item in shortList" :key="item.title">
 									<span>{{ item.title }}</span>
-									<input type="checkbox" :checked="item.checked" @change="shortChange(item.index, $event)" />
+									<input type="checkbox" v-model="item.checked" />
 								</li>
 							</ul>
 						</el-form-item>
@@ -76,7 +76,11 @@ export default {
 				shortNameIndex: ''
 			},
 			//表单验证
-			deptFormRules: {}
+			deptFormRules: {
+				deptName: [{ required: true, message: '部门名称不能为空', trigger: 'submit' }]
+			},
+			//简写数据
+			shortList: []
 		}
 	},
 	created() {
@@ -91,17 +95,6 @@ export default {
 			}
 		})
 	},
-	computed: {
-		shortList() {
-			return this.deptForm.deptName.split('').map((title, index) => {
-				return {
-					index,
-					title,
-					checked: true
-				}
-			})
-		}
-	},
 	provide() {
 		return {
 			updData: this.updData,
@@ -116,10 +109,30 @@ export default {
 			this.resetForm()
 		},
 		//表单重置
-		resetForm() {},
+		resetForm() {
+			this.deptForm = {
+				parentId: 0,
+				parentName: '',
+				deptName: '',
+				shortName: '',
+				shortNameIndex: ''
+			}
+		},
 		//弹窗提交
 		sub() {
-			console.log(this.shortList)
+			this.$refs['deptForm'].validate(valid => {
+				if (valid) {
+					if (this.deptForm.deptId != undefined) {
+					} else {
+						addDept(this.deptForm).then(res => {
+							if (res.code === 200) {
+								this.$msg({ message: '添加成功' })
+								this.cancel()
+							}
+						})
+					}
+				}
+			})
 		},
 		//编辑部门
 		updData(type, data) {
@@ -133,8 +146,16 @@ export default {
 				this.title = '部门修改'
 			}
 		},
-		//简称索引改变
-		shortChange(index, e) {},
+		//设置简写
+		setShortList() {
+			this.shortList = this.deptForm.deptName.split('').map((title, index) => {
+				return {
+					index,
+					title,
+					checked: true
+				}
+			})
+		},
 		delData() {},
 		resetDel() {}
 	}