From 04e7b94aab3e7ebe94b33da9209fd187614cc99d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Fri, 18 Mar 2022 15:16:53 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E7=BB=84=E4=BB=B6=E4=BA=8C=E6=AC=A1?=
 =?UTF-8?q?=E5=B0=81=E8=A3=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .gitignore                            | 26 ++--------
 src/.eslintrc.json                    | 64 ------------------------
 src/auto-imports.d.ts                 | 65 ------------------------
 src/components.d.ts                   | 29 -----------
 src/components/ElSelect.vue           |  9 ----
 src/components/extra/ElCascader.vue   | 17 +++++++
 src/components/{ => extra}/ElIcon.vue |  0
 src/components/extra/ElSelect.vue     | 72 +++++++++++++++++++++++++++
 src/router/modules/education.js       | 10 ++--
 src/views/home/index.vue              |  8 ++-
 10 files changed, 106 insertions(+), 194 deletions(-)
 delete mode 100644 src/.eslintrc.json
 delete mode 100644 src/auto-imports.d.ts
 delete mode 100644 src/components.d.ts
 delete mode 100644 src/components/ElSelect.vue
 create mode 100644 src/components/extra/ElCascader.vue
 rename src/components/{ => extra}/ElIcon.vue (100%)
 create mode 100644 src/components/extra/ElSelect.vue

diff --git a/.gitignore b/.gitignore
index a547bf3..1d401cc 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,24 +1,8 @@
-# Logs
-logs
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-pnpm-debug.log*
-lerna-debug.log*
-
+.idea
+.DS_Store
 node_modules
 dist
-dist-ssr
 *.local
-
-# Editor directories and files
-.vscode/*
-!.vscode/extensions.json
-.idea
-.DS_Store
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?
+src/.eslintrc.json
+src/.auto-imports.d.ts
+src/.components.d.ts
diff --git a/src/.eslintrc.json b/src/.eslintrc.json
deleted file mode 100644
index 2436af4..0000000
--- a/src/.eslintrc.json
+++ /dev/null
@@ -1,64 +0,0 @@
-{
-  "globals": {
-    "_": true,
-    "axios": true,
-    "computed": true,
-    "createApp": true,
-    "createLogger": true,
-    "createNamespacedHelpers": true,
-    "createStore": true,
-    "customRef": true,
-    "dayjs": true,
-    "defineAsyncComponent": true,
-    "defineComponent": true,
-    "effectScope": true,
-    "EffectScope": true,
-    "getCurrentInstance": true,
-    "getCurrentScope": true,
-    "h": true,
-    "inject": true,
-    "isReadonly": true,
-    "isRef": true,
-    "mapActions": true,
-    "mapGetters": true,
-    "mapMutations": true,
-    "mapState": true,
-    "markRaw": true,
-    "nextTick": true,
-    "onActivated": true,
-    "onBeforeMount": true,
-    "onBeforeUnmount": true,
-    "onBeforeUpdate": true,
-    "onDeactivated": true,
-    "onErrorCaptured": true,
-    "onMounted": true,
-    "onRenderTracked": true,
-    "onRenderTriggered": true,
-    "onScopeDispose": true,
-    "onServerPrefetch": true,
-    "onUnmounted": true,
-    "onUpdated": true,
-    "provide": true,
-    "reactive": true,
-    "readonly": true,
-    "ref": true,
-    "resolveComponent": true,
-    "shallowReactive": true,
-    "shallowReadonly": true,
-    "shallowRef": true,
-    "toRaw": true,
-    "toRef": true,
-    "toRefs": true,
-    "triggerRef": true,
-    "unref": true,
-    "useAttrs": true,
-    "useCssModule": true,
-    "useCssVars": true,
-    "useRoute": true,
-    "useRouter": true,
-    "useSlots": true,
-    "useStore": true,
-    "watch": true,
-    "watchEffect": true
-  }
-}
\ No newline at end of file
diff --git a/src/auto-imports.d.ts b/src/auto-imports.d.ts
deleted file mode 100644
index d1126ef..0000000
--- a/src/auto-imports.d.ts
+++ /dev/null
@@ -1,65 +0,0 @@
-// Generated by 'unplugin-auto-import'
-// We suggest you to commit this file into source control
-declare global {
-  const _: typeof import('lodash')
-  const axios: typeof import('axios')['default']
-  const computed: typeof import('vue')['computed']
-  const createApp: typeof import('vue')['createApp']
-  const createLogger: typeof import('vuex')['createLogger']
-  const createNamespacedHelpers: typeof import('vuex')['createNamespacedHelpers']
-  const createStore: typeof import('vuex')['createStore']
-  const customRef: typeof import('vue')['customRef']
-  const dayjs: typeof import('dayjs')
-  const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
-  const defineComponent: typeof import('vue')['defineComponent']
-  const effectScope: typeof import('vue')['effectScope']
-  const EffectScope: typeof import('vue')['EffectScope']
-  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
-  const getCurrentScope: typeof import('vue')['getCurrentScope']
-  const h: typeof import('vue')['h']
-  const inject: typeof import('vue')['inject']
-  const isReadonly: typeof import('vue')['isReadonly']
-  const isRef: typeof import('vue')['isRef']
-  const mapActions: typeof import('vuex')['mapActions']
-  const mapGetters: typeof import('vuex')['mapGetters']
-  const mapMutations: typeof import('vuex')['mapMutations']
-  const mapState: typeof import('vuex')['mapState']
-  const markRaw: typeof import('vue')['markRaw']
-  const nextTick: typeof import('vue')['nextTick']
-  const onActivated: typeof import('vue')['onActivated']
-  const onBeforeMount: typeof import('vue')['onBeforeMount']
-  const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
-  const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
-  const onDeactivated: typeof import('vue')['onDeactivated']
-  const onErrorCaptured: typeof import('vue')['onErrorCaptured']
-  const onMounted: typeof import('vue')['onMounted']
-  const onRenderTracked: typeof import('vue')['onRenderTracked']
-  const onRenderTriggered: typeof import('vue')['onRenderTriggered']
-  const onScopeDispose: typeof import('vue')['onScopeDispose']
-  const onServerPrefetch: typeof import('vue')['onServerPrefetch']
-  const onUnmounted: typeof import('vue')['onUnmounted']
-  const onUpdated: typeof import('vue')['onUpdated']
-  const provide: typeof import('vue')['provide']
-  const reactive: typeof import('vue')['reactive']
-  const readonly: typeof import('vue')['readonly']
-  const ref: typeof import('vue')['ref']
-  const resolveComponent: typeof import('vue')['resolveComponent']
-  const shallowReactive: typeof import('vue')['shallowReactive']
-  const shallowReadonly: typeof import('vue')['shallowReadonly']
-  const shallowRef: typeof import('vue')['shallowRef']
-  const toRaw: typeof import('vue')['toRaw']
-  const toRef: typeof import('vue')['toRef']
-  const toRefs: typeof import('vue')['toRefs']
-  const triggerRef: typeof import('vue')['triggerRef']
-  const unref: typeof import('vue')['unref']
-  const useAttrs: typeof import('vue')['useAttrs']
-  const useCssModule: typeof import('vue')['useCssModule']
-  const useCssVars: typeof import('vue')['useCssVars']
-  const useRoute: typeof import('vue-router')['useRoute']
-  const useRouter: typeof import('vue-router')['useRouter']
-  const useSlots: typeof import('vue')['useSlots']
-  const useStore: typeof import('vuex')['useStore']
-  const watch: typeof import('vue')['watch']
-  const watchEffect: typeof import('vue')['watchEffect']
-}
-export {}
diff --git a/src/components.d.ts b/src/components.d.ts
deleted file mode 100644
index 998b048..0000000
--- a/src/components.d.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-// generated by unplugin-vue-components
-// We suggest you to commit this file into source control
-// Read more: https://github.com/vuejs/vue-next/pull/3399
-
-declare module 'vue' {
-  export interface GlobalComponents {
-    ElAvatar: typeof import('element-plus/es')['ElAvatar']
-    ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
-    ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
-    ElButton: typeof import('element-plus/es')['ElButton']
-    ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
-    ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
-    ElDivider: typeof import('element-plus/es')['ElDivider']
-    ElDropdown: typeof import('element-plus/es')['ElDropdown']
-    ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
-    ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
-    ElIcon: typeof import('./components/ElIcon.vue')['default']
-    ElInput: typeof import('element-plus/es')['ElInput']
-    ElMenu: typeof import('element-plus/es')['ElMenu']
-    ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
-    ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
-    ElSelect: typeof import('./components/ElSelect.vue')['default']
-    ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
-    ElTabPane: typeof import('element-plus/es')['ElTabPane']
-    ElTabs: typeof import('element-plus/es')['ElTabs']
-  }
-}
-
-export { }
diff --git a/src/components/ElSelect.vue b/src/components/ElSelect.vue
deleted file mode 100644
index 8bb7d6f..0000000
--- a/src/components/ElSelect.vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<template>
-    1
-    <component :is="ElSelect" />
-</template>
-<script setup>
-    import { ElSelect } from 'element-plus/es/components/select/index';
-</script>
-
-<style lang="less" scoped></style>
diff --git a/src/components/extra/ElCascader.vue b/src/components/extra/ElCascader.vue
new file mode 100644
index 0000000..65441b4
--- /dev/null
+++ b/src/components/extra/ElCascader.vue
@@ -0,0 +1,17 @@
+<template>
+    <component :is="render" />
+</template>
+<script setup lang="jsx">
+    import { ElCascader } from 'element-plus/es/components/cascader/index';
+    import 'element-plus/es/components/cascader/style/css';
+    const props = defineProps({
+        clearable: {
+            type: Boolean,
+            default: true,
+        },
+    });
+    const slots = useSlots();
+    const render = () => <ElCascader {...props} v-slots={slots} />;
+</script>
+
+<style lang="less" scoped></style>
diff --git a/src/components/ElIcon.vue b/src/components/extra/ElIcon.vue
similarity index 100%
rename from src/components/ElIcon.vue
rename to src/components/extra/ElIcon.vue
diff --git a/src/components/extra/ElSelect.vue b/src/components/extra/ElSelect.vue
new file mode 100644
index 0000000..0e01780
--- /dev/null
+++ b/src/components/extra/ElSelect.vue
@@ -0,0 +1,72 @@
+<template>
+    <component :is="render" />
+</template>
+<script setup lang="jsx">
+    import { ElSelect, ElOption } from 'element-plus/es/components/select/index';
+    import 'element-plus/es/components/select/style/css';
+    const props = defineProps({
+        opts: {
+            type: Array,
+            required: true,
+        },
+        clearable: {
+            type: Boolean,
+            default: true,
+        },
+        filterable: {
+            type: Boolean,
+            default: true,
+        },
+        config: {
+            type: Object,
+            default() {
+                return {
+                    label: 'label',
+                    value: 'value',
+                    disabled: 'disabled',
+                };
+            },
+        },
+    });
+    const slots = useSlots();
+    let config = {
+        label: 'label',
+        value: 'value',
+        disabled: 'disabled',
+        ...props.config,
+    };
+    function handleItemDisabled(item, index) {
+        let res = false;
+        if (config.disabled instanceof Function) {
+            res = config.disabled(item, index);
+        } else {
+            res = !!item[config.disabled];
+        }
+        return res;
+    }
+    const opts = computed(() =>
+        props.opts.map((item) => {
+            return typeof item !== 'object' ? { label: item, value: item } : item;
+        })
+    );
+    const render = () => (
+        <ElSelect
+            {...props}
+            v-slots={{
+                default: () =>
+                    unref(opts).map((item, index) => (
+                        <ElOption
+                            label={item[config.label]}
+                            value={item[config.value]}
+                            disabled={handleItemDisabled(item, index)}
+                        >
+                            {slots.option?.(item, index) || item[config.label]}
+                        </ElOption>
+                    )),
+                ...slots,
+            }}
+        ></ElSelect>
+    );
+</script>
+
+<style lang="less" scoped></style>
diff --git a/src/router/modules/education.js b/src/router/modules/education.js
index 4584216..a433269 100644
--- a/src/router/modules/education.js
+++ b/src/router/modules/education.js
@@ -58,7 +58,7 @@ export default [
             {
                 path: 'admission',
                 name: 'AdmissionManagement',
-                component: () => import('@/views/global/home.vue'),
+                component: () => import('@/views/home/index.vue'),
                 component: () => import('@/views/home/index.vue'),
                 meta: {
                     title: '入学',
@@ -88,7 +88,7 @@ export default [
             {
                 path: 'answer',
                 name: 'Answer',
-                component: () => import('@/views/global/home.vue'),
+                component: () => import('@/views/home/index.vue'),
                 component: () => import('@/views/home/index.vue'),
                 meta: {
                     title: '答疑',
@@ -98,7 +98,7 @@ export default [
                     {
                         path: 'management',
                         name: 'AnswerManagement',
-                        component: () => import('@/views/global/home.vue'),
+                        component: () => import('@/views/home/index.vue'),
                         component: () => import('@/views/home/index.vue'),
                         meta: {
                             title: '答疑管理',
@@ -148,7 +148,7 @@ export default [
                     {
                         path: 'teacher',
                         name: 'AnswerTeacher',
-                        component: () => import('@/views/global/home.vue'),
+                        component: () => import('@/views/home/index.vue'),
                         component: () => import('@/views/home/index.vue'),
                         meta: {
                             title: '答疑老师管理',
@@ -218,7 +218,7 @@ export default [
             {
                 path: 'research',
                 name: 'CourseResearch',
-                component: () => import('@/views/global/home.vue'),
+                component: () => import('@/views/home/index.vue'),
                 component: () => import('@/views/home/index.vue'),
                 meta: {
                     title: '课研更新',
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 226c12f..4f89305 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,6 +1,12 @@
 <template>
     <div class="container">
-        <el-select></el-select>
+        <el-select
+            :opts="[
+                { label: '女', value: 0 },
+                { label: '男', value: 1 },
+            ]"
+        ></el-select>
+        <el-cascader></el-cascader>
         <h1>{{ $route.name }}</h1>
         <h1>TOKEN:{{ token }}</h1>
         <h2>{{ userInfo }}</h2>