admin_home/src/views/role/creatUser.vue

<template>
  <div class="mainBox">
    <div class="layerBox">
      <tableTitle :name="tableDivTitle"/>
      <div>
        <el-radio-group v-model="userType">
          <el-radio v-for="option in radioOptions" 
                     :key="option.label" 
                     :label="option.value" 
                     :disabled="isDisabled(option.value)">
            {{ option.label }}
          </el-radio>
        </el-radio-group>
      </div>
    </div>
    <!-- 根据 userType 的值动态显示组件 -->
    <user-admin v-if="userType === '10000'" />
    <user-investigate v-if="userType === '4'" />
    <user-default v-if="userType === '1'" />
    <user-enterprise v-if="userType === '3'" />
    <user-politician v-if="userType === '2'" />
  </div>
</template>

<script>
// 引入组件
import tableTitle from './components/tableTitle';
import userAdmin from './components/userAdmin'; // 引入管理员组件
import userInvestigate from './components/userInvestigate'; // 引入调研员组件
import userDefault from './components/userDefault'; // 引入个人会员组件
import userEnterprise from './components/userEnterprise'; // 引入企业会员组件
import userPolitician from './components/userPolitician'; // 引入政务会员组件
// 引入公用样式
import '@/styles/global.less';

export default {
  components: {
    tableTitle,
    userAdmin, // 注册管理员组件
    userInvestigate, // 注册调研员组件
    userDefault, // 注册个人会员组件
    userEnterprise, // 注册企业会员组件
    userPolitician // 注册政务会员组件
  },
  data() {
    return {
      tableDivTitle: "选择用户类型",
      userType: "10000", // 用户类型
      radioOptions: [
        // { label: '管理员', value: '10000' },
        { label: '调研员', value: '4' },
        { label: '个人会员', value: '1' },
        { label: '企业会员', value: '3' },
        { label: '政务会员', value: '2' }
      ]
    };
  },
  methods: {
    isDisabled(value) {
      // 如果 type_id 存在，则禁用与 userType 不对应的选项
      if (this.$route.query.type_id) {
        return value !== this.userType;
      }
      // 如果 type_id 不存在，则允许所有选项
      return false;
    }
  },
  mounted() {
    // 其他逻辑
    if (this.$route.query.type_id != undefined) {
      this.userType = String(this.$route.query.type_id);
      console.log("编辑用户！");
    } else {
      console.log("添加用户！");
    }
  },
};
</script>

<style scoped lang="less">
  
</style>