patent-cms/src/views/adminCenter/adminUser/detail.vue

<template>
  <div id="detail">
    <el-row>
      <el-col :span="24" class="main">
        <el-col class="one">
          <el-button type="primary" size="mini" @click="toReturn()">返回</el-button>
        </el-col>
        <el-col class="two">
          <el-form :model="form" :rules="rules" ref="form" label-width="140px">
            <el-col :span="12">
              <el-form-item label="邀请码" prop="code">
                <el-select v-model="form.code" clearable filterable placeholder="请选择" style="width: 100%" size="small">
                  <el-option v-for="item in codeList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="姓名" prop="name">
                <el-input v-model="form.name" placeholder="请输入姓名" size="small"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="手机号" prop="phone">
                <el-input v-model="form.phone" placeholder="请输入手机号" size="small"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="登录密码" prop="password">
                <el-input v-model="form.password" placeholder="请输入登录密码" size="small"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="身份证号" prop="card">
                <el-input v-model="form.card" placeholder="请输入身份证号" size="small"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="电子邮箱" prop="email">
                <el-input v-model="form.email" placeholder="请输入电子邮箱" size="small"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="联系地址" prop="addr">
                <el-input v-model="form.addr" placeholder="请输入联系地址" size="small"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="职务职称" prop="zwzc">
                <el-input v-model="form.zwzc" placeholder="请输入职务职称" size="small"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="院校" prop="school">
                <el-input v-model="form.school" placeholder="请输入院校" size="small"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="专业" prop="major">
                <el-input v-model="form.major" placeholder="请输入专业" size="small"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="所属辖区" prop="juris">
                <el-select v-model="form.juris" clearable filterable placeholder="请选择" style="width: 100%" size="small">
                  <el-option v-for="item in jurisList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="审核状态" prop="status">
                <el-radio v-model="status" label="0">待审</el-radio>
                <el-radio v-model="status" label="1">通过</el-radio>
                <el-radio v-model="status" label="2">拒绝</el-radio>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item>
                <el-button class="btn" type="primary" size="mini" @click="onSubmit('form')">提交保存</el-button>
              </el-form-item>
            </el-col>
          </el-form>
        </el-col>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { mapState, createNamespacedHelpers } from 'vuex';
export default {
  name: 'detail',
  props: {},
  components: {},
  data: function () {
    return {
      rules: {
        code: [{ required: true, message: '请选择邀请码', trigger: 'blur' }],
        name: [{ required: true, message: '姓名', trigger: 'blur' }],
        phone: [{ required: true, message: '手机号', trigger: 'blur' }],
        password: [{ required: true, message: '登录密码', trigger: 'blur' }],
        status: [{ required: true, message: '审核状态', trigger: 'blur' }],
      },
      form: {},
      status: '',
      // 邀请码
      codeList: [
        { value: '0', label: '吉林专利市场系统管理员' },
        { value: '1', label: '长春工程学院' },
        { value: '2', label: '长春工业大学' },
        { value: '3', label: '中国科学院东北地理与农业生态研究所' },
        { value: '4', label: '长春中医药大学' },
        { value: '5', label: '北华大学' },
        { value: '6', label: '吉林工程技术师范学院' },
      ],
      // 所属辖区
      jurisList: [
        { value: '0', label: '长春新区' },
        { value: '1', label: '净月区' },
        { value: '2', label: '汽开区' },
        { value: '3', label: '经开区' },
        { value: '4', label: '高新区' },
        { value: '5', label: '南关区' },
        { value: '6', label: '朝阳区' },
        { value: '7', label: '宽城区' },
        { value: '8', label: '二道区' },
        { value: '9', label: '绿园区' },
        { value: '10', label: '双阳区' },
        { value: '11', label: '九台区' },
      ],
    };
  },
  created() {},
  methods: {
    onSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.$emit('onSubmit', { data: this.form });
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    //返回
    toReturn() {
      this.$router.push({ path: '/adminCenter/adminUser/index' });
    },
  },
  computed: {
    ...mapState(['user']),
  },
  metaInfo() {
    return { title: this.$route.meta.title };
  },
  watch: {
    test: {
      deep: true,
      immediate: true,
      handler(val) {},
    },
  },
};
</script>

<style lang="less" scoped>
.main {
  .one {
    padding: 0 0 20px 10px;
    .sp {
      padding: 0px 0 0 170px;
      font-size: 24px;
      font-weight: 700;
      margin-right: 10px;
    }
  }
}
</style>