[add] test

package.json

@@ -1,23 +1,24 @@
 {
-  "name": "bj-casino-rank",
-  "private": true,
-  "version": "0.0.0",
-  "scripts": {
-    "dev": "vite",
-    "build": "vue-tsc --noEmit && vite build",
-    "preview": "vite preview"
-  },
-  "dependencies": {
-    "@ant-design/icons-vue": "^6.1.0",
-    "axios": "^0.26.1",
-    "bootstrap": "^5.1.3",
-    "moment": "^2.29.2",
-    "vue": "^3.2.25"
-  },
-  "devDependencies": {
-    "@vitejs/plugin-vue": "^2.3.0",
-    "typescript": "^4.5.4",
-    "vite": "^2.9.0",
-    "vue-tsc": "^0.29.8"
-  }
+    "name": "bj-casino-rank",
+    "private": true,
+    "version": "0.0.0",
+    "scripts": {
+        "dev": "vite",
+        "build": "vite build",
+        "preview": "vite preview"
+    },
+    "dependencies": {
+        "@ant-design/icons-vue": "^6.1.0",
+        "axios": "^0.26.1",
+        "bootstrap": "^5.1.3",
+        "element-plus": "^2.1.9",
+        "moment": "^2.29.2",
+        "vue": "^3.2.25"
+    },
+    "devDependencies": {
+        "@vitejs/plugin-vue": "^2.3.0",
+        "typescript": "^4.5.4",
+        "vite": "^2.9.0",
+        "vue-tsc": "^0.29.8"
+    }
 }

src/App.vue

@@ -1,15 +1,35 @@
 <script setup lang="ts">
+import type { TabsPaneContext } from 'element-plus';
+import { ref } from "vue";
 import BJ_Casino_Rank from './components/BJ_Casino_Rank.vue';
+
+const activeName = ref('first')
+const handleClick = (tab: TabsPaneContext, event: Event) => {
+    console.log(tab, event)
+}
 </script>
 
 <template>
     <div>
-        <BJ_Casino_Rank />
+        <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
+            <el-tab-pane label="User" name="first">
+                <BJ_Casino_Rank />
+            </el-tab-pane>
+            <el-tab-pane label="Config" name="second">Config</el-tab-pane>
+            <el-tab-pane label="Role" name="third">Role</el-tab-pane>
+            <el-tab-pane label="Task" name="fourth">Task</el-tab-pane>
+        </el-tabs>
     </div>
 </template>
 
 <style>
 @import url('../src/assets/fonts.css');
+@import url('../src/assets/style.css');
+
+.demo-tabs>.el-tabs__content {
+    width: 50%;
+    margin: 0 auto;
+}
 
 #app {
     font-family: Avenir, Helvetica, Arial, sans-serif;

src/assets/style.css

@@ -2,6 +2,11 @@
     width: inherit;
 }
 
+.el-tabs__nav-scroll {
+    /* width: 50%; */
+    margin: 0 auto;
+}
+
 /* .main {
     width: 80%;
     margin: 20px auto;

src/components/BJ_Casino_Rank.vue

@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import { ref } from "vue";
-import '../assets/style.css';
 import { BJ_Casino_Rank } from "../script/BJ_Casino_Rank";
 
 let Title = ref("BJ_Casino_Rank");

src/main.ts

@@ -1,7 +1,10 @@
 import 'bootstrap';
 import 'bootstrap/dist/css/bootstrap.min.css';
+import ElementPlus from 'element-plus';
+import 'element-plus/dist/index.css';
+import locale from 'element-plus/lib/locale/lang/zh-tw';
 import { createApp } from 'vue';
 import App from './App.vue';
 
 
-createApp(App).mount('#app')
+createApp(App).use(ElementPlus, { locale }).mount('#app')