添加审核

src/router/modules/exam.js

@@ -1,7 +1,7 @@
 import i18n from '@/lang'
 export const routes = [
   {
-    path: '/exam',
+    path: '/exam/index',
     name: 'exam_index',
     meta: {
       title: i18n.global.t('menus.exam'),

src/views/exam/index.vue

@@ -1,8 +1,59 @@
 <template>
-  <div id="index">
-    <p>index</p>
-  </div>
+  <el-row v-if="options.length > 0">
+    <el-col :span="24">
+      <el-segmented v-model="value" :options="options" @change="viewChange" block>
+        <template #default="{ item }"> {{ item.label }} </template>
+      </el-segmented>
+      <el-divider />
+      <template v-if="!value">
+        <el-alert title="请在上方选择您要查看的数据" type="warning" effect="dark" :closable="false" />
+      </template>
+      <template v-else>
+        <component :is="viewComponent"></component>
+      </template>
+    </el-col>
+  </el-row>
 </template>
 
-<script setup></script>
+<script setup>
+import { get } from 'lodash-es'
+import { defineAsyncComponent } from 'vue'
+const componentList = ref({
+  contact: defineAsyncComponent(() => import('./parts/contact.vue')),
+  company: defineAsyncComponent(() => import('./parts/company.vue'))
+})
+const value = ref()
+const viewComponent = ref()
+/**
+ * 子页面设置
+ * @param label 子页面名称
+ * @param value 子页面id
+ * @param component 子页面文件名,需要与代码中的页面对应,上面componentList设置的key
+ */
+const route = useRoute()
+const path = get(route, 'path')
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const menus = userStore.menus
+const thisRouteConfig = menus.find((f) => f.path === path)
+const children = get(thisRouteConfig, 'children', [])
+const options = children.map((i) => {
+  const obj = {
+    label: get(i, 'name'),
+    value: get(i, 'id'),
+    component: get(i, 'component')
+  }
+  return obj
+})
+
+const viewChange = (val) => {
+  const i = options.find((f) => f.value === val)
+  if (!i) return
+  const componentName = get(i, 'component')
+  if (!componentName) return
+  const component = componentList.value[componentName]
+  if (!component) return
+  viewComponent.value = component
+}
+</script>
 <style scoped></style>

src/views/exam/parts/company.vue

@@ -0,0 +1,8 @@
+<template>
+  <div id="company">
+    <p>company</p>
+  </div>
+</template>
+
+<script setup></script>
+<style scoped></style>

src/views/exam/parts/contact.vue

@@ -0,0 +1,8 @@
+<template>
+  <div id="contact">
+    <p>contact</p>
+  </div>
+</template>
+
+<script setup></script>
+<style scoped></style>