feat: 自定义页面

src/lang/modules/enUS.ts

@@ -27,6 +27,7 @@ export default {
     ["print"]: "print",
     ["draggable"]: "draggable",
     ["editor"]: "editor",
+    ["usre-center"]: "usre center",
     ["markdown"]: "Markdown",
     ["custom-instruction"]: "custom instruction",
     ["anti-shake"]: "anti shake",

src/lang/modules/zhCN.ts

@@ -27,6 +27,7 @@ export default {
     ["print"]: "打印",
     ["draggable"]: "拖拽",
     ["editor"]: "富文本",
+    ["usre-center"]: "用户中心",
     ["markdown"]: "Markdown",
     ["custom-instruction"]: "自定义指令",
     ["anti-shake"]: "防抖",

src/router/route.ts

@@ -354,6 +354,23 @@ export const dynamicRoutes: RouteRecordRaw[] = [
               sort: 4
             },
             children: []
+          },
+          {
+            path: "/common-component/usre-center",
+            name: "usre-center",
+            component: () => import("@/views/common-component/usre-center/usre-center.vue"),
+            meta: {
+              title: "usre-center",
+              hide: false,
+              keepAlive: true,
+              affix: false,
+              link: "",
+              iframe: false,
+              roles: ["admin"],
+              icon: "icon-menu",
+              sort: 5
+            },
+            children: []
           }
         ]
       },

src/views/common-component/usre-center/usre-center.vue

@@ -0,0 +1,46 @@
+<template>
+  <div class="dc-page" style="padding: 100px">
+    <div class="my-avatar">
+      <a-avatar :size="100">
+        <img alt="avatar" :src="myImage" />
+      </a-avatar>
+      <div class="my-name">
+        <div class="my-title">王马Verge</div>
+        <div class="my-local">素材投稿：2547096351@qq.com</div>
+      </div>
+    </div>
+    <div class="btn-box">
+      <a-button type="outline" style="width: 100px">转发</a-button>
+      <a-button type="primary" style="width: 100px" color="#00aeec">关注</a-button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import myImage from "@/assets/img/my-image.jpg";
+</script>
+
+<style lang="scss" scoped>
+.my-avatar {
+  display: flex;
+}
+.my-name {
+  height: 100%;
+  margin-left: 10px;
+  .my-title {
+    font-weight: bold;
+    font-size: 20px;
+    margin-top: 15px;
+  }
+  .my-local {
+    margin-top: 25px;
+  }
+}
+
+.btn-box {
+  width: 220px;
+  display: flex;
+  justify-content: space-between;
+  margin: 20px 0 0 0;
+}
+</style>

src/views/custom-instruction/test-instruction/test-instruction.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="dc-page">
-    <!-- 测试指令 -->
+    测试指令
     <!-- <button v-custom="{ goodsId, event: getFun }" :rowData="goodsId">文字变色</button> -->
-    <button @click="jump">文字变色</button>
+    <!-- <button @click="jump">文字变色</button> -->
   </div>
 </template>
 
@@ -22,15 +22,15 @@
 // const getFun = (e: any) => {
 //   console.log("点击事件", e);
 // };
-const router = useRouter();
-const jump = () => {
-  router.push({
-    path: "/home",
-    query: {
-      name: "张三"
-    }
-  });
-};
+// const router = useRouter();
+// const jump = () => {
+//   router.push({
+//     path: "/home",
+//     query: {
+//       name: "张三"
+//     }
+//   });
+// };
 </script>
 
 <style lang="scss" scoped></style>