v3.0.6

source/vue/xzs-admin/src/views/user/admin/edit.vue

@@ -0,0 +1,122 @@
+<template>
+  <div class="app-container">
+
+    <el-form :model="form" ref="form" label-width="100px" v-loading="formLoading" :rules="rules">
+      <el-form-item label="用户名："  prop="userName" required>
+        <el-input v-model="form.userName"></el-input>
+      </el-form-item>
+      <el-form-item label="密码：" required>
+        <el-input v-model="form.password"></el-input>
+      </el-form-item>
+      <el-form-item label="真实姓名：" prop="realName"   required>
+        <el-input v-model="form.realName"></el-input>
+      </el-form-item>
+      <el-form-item label="年龄：">
+        <el-input v-model="form.age"></el-input>
+      </el-form-item>
+      <el-form-item label="性别：">
+        <el-select v-model="form.sex" placeholder="性别" clearable>
+          <el-option v-for="item in sexEnum" :key="item.key" :value="item.key" :label="item.value"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="出生日期：">
+        <el-date-picker v-model="form.birthDay" type="date" placeholder="选择日期"/>
+      </el-form-item>
+      <el-form-item label="手机：">
+        <el-input v-model="form.phone"></el-input>
+      </el-form-item>
+      <el-form-item label="状态：" required>
+        <el-select v-model="form.status" placeholder="状态">
+          <el-option v-for="item in statusEnum" :key="item.key" :value="item.key" :label="item.value"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="submitForm">提交</el-button>
+        <el-button @click="resetForm">重置</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import { mapGetters, mapState, mapActions } from 'vuex'
+import userApi from '@/api/user'
+
+export default {
+  data () {
+    return {
+      form: {
+        id: null,
+        userName: '',
+        password: '',
+        realName: '',
+        role: 3,
+        status: 1,
+        age: '',
+        sex: '',
+        birthDay: null,
+        phone: null
+      },
+      formLoading: false,
+      rules: {
+        userName: [
+          { required: true, message: '请输入用户名', trigger: 'blur' }
+        ],
+        realName: [
+          { required: true, message: '请输入真实姓名', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  created () {
+    let id = this.$route.query.id
+    let _this = this
+    if (id && parseInt(id) !== 0) {
+      _this.formLoading = true
+      userApi.selectUser(id).then(re => {
+        _this.form = re.response
+        _this.formLoading = false
+      })
+    }
+  },
+  methods: {
+    submitForm () {
+      let _this = this
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          this.formLoading = true
+          userApi.createUser(this.form).then(data => {
+            if (data.code === 1) {
+              _this.$message.success(data.message)
+              _this.delCurrentView(_this).then(() => {
+                _this.$router.push('/user/admin/list')
+              })
+            } else {
+              _this.$message.error(data.message)
+              _this.formLoading = false
+            }
+          }).catch(e => {
+            _this.formLoading = false
+          })
+        } else {
+          return false
+        }
+      })
+    },
+    resetForm () {
+      this.$refs['form'].resetFields()
+    },
+    ...mapActions('tagsView', { delCurrentView: 'delCurrentView' })
+  },
+  computed: {
+    ...mapGetters('enumItem', [
+      'enumFormat'
+    ]),
+    ...mapState('enumItem', {
+      sexEnum: state => state.user.sexEnum,
+      roleEnum: state => state.user.roleEnum,
+      statusEnum: state => state.user.statusEnum
+    })
+  }
+}
+</script>