fengchuanyu 3 月之前
父節點
當前提交
1ef63a8e45

+ 4 - 0
12_vuecli/mediaapp/package.json

@@ -9,9 +9,13 @@
   },
   "dependencies": {
     "axios": "^1.7.9",
+    "babel-runtime": "^6.26.0",
     "core-js": "^3.8.3",
+    "mavon-editor": "^2.10.4",
     "vant": "^2.13.6",
     "vue": "^2.6.14",
+    "vue-markdown": "^2.2.4",
+    "vue-markdown-render": "^2.2.1",
     "vue-router": "^3.5.1"
   },
   "devDependencies": {

+ 7 - 3
12_vuecli/mediaapp/src/App.vue

@@ -7,8 +7,8 @@
       <router-link to="/mine">Mine</router-link>
     </nav>
     <router-view/> -->
-    <NavComp :val="tabVal"></NavComp>
-    <router-view @changePage="changeTabVal"/>
+    <NavComp v-if="showNav" :val="tabVal"></NavComp>
+    <router-view @changeNav="hideNav" @changePage="changeTabVal"/>
   </div>
 </template>
 <script>
@@ -16,10 +16,14 @@ import NavComp from '@/components/NavComp.vue'
 export default {
   data() {
     return {
-      tabVal:'1001'
+      tabVal:'1001',
+      showNav:true
     }
   },
   methods: {
+    hideNav(val){
+      this.showNav = val
+    },
     changeTabVal(val){
       this.tabVal = val
     }

+ 5 - 0
12_vuecli/mediaapp/src/router/index.js

@@ -21,6 +21,11 @@ const routes = [
     path:'/mine',
     name:'mine',
     component:() => import("../views/mine/MinePage.vue")
+  },
+  {
+    path:'/score',
+    name:'score',
+    component:() => import("../views/mine/MineScore.vue")
   }
 ]
 

+ 39 - 6
12_vuecli/mediaapp/src/views/mine/MinePage.vue

@@ -1,12 +1,45 @@
 <template>
-    <div class="mine-container">
-        <h1>Mine</h1>
+  <div class="mine-container">
+    <div class="header">
+      <van-image
+        round
+        width="2.5rem"
+        height="2.5rem"
+        src="https://img01.yzcdn.cn/vant/cat.jpeg"
+      />
+      <h3>昵称</h3>
     </div>
+    <div class="nav">
+      <van-cell-group inset>
+        <van-cell title="我的成绩" size="large" is-link to="/score" icon="edit"/>
+        <van-cell title="我的地址" size="large" is-link icon="location-o"/>
+      </van-cell-group>
+    </div>
+  </div>
 </template>
+<style scoped>
+.mine-container {
+  background-color: #9bb771;
+  position: absolute;
+  top: 1rem;
+  left: 0;
+  right: 0;
+  bottom: 1rem;
+}
+.header {
+  margin-top: 0.5rem;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.header h3 {
+  font-size: 0.6rem;
+}
+</style>
 <script>
 export default {
-    mounted() {
-        this.$emit("changePage",'1004')
-    },
-}
+  mounted() {
+    this.$emit("changePage", "1004");
+  },
+};
 </script>

+ 32 - 0
12_vuecli/mediaapp/src/views/mine/MineScore.vue

@@ -0,0 +1,32 @@
+<template>
+  <div class="mine-score">
+    <div class="nav-content">
+      <van-nav-bar
+        title="我的成绩"
+        left-text="返回"
+        left-arrow
+        @click-left="$router.go(-1)"
+      />
+    </div>
+    我的成绩
+  </div>
+</template>
+<style scoped>
+    .nav-content{
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 100%;
+        z-index: 1000;
+    }
+</style>
+<script>
+export default {
+  created() {
+    this.$emit("changeNav", false);
+  },
+  beforeDestroy(){
+    this.$emit("changeNav", true);
+  },
+};
+</script>

+ 8 - 3
12_vuecli/mediaapp/src/views/talk/TalkPage.vue

@@ -3,7 +3,9 @@
     <div class="talk-list">
       <div class="talk-item" v-for="(item, index) in talkList" :key="index">
         <div class="ask">{{ item.ask }}</div>
-        <div class="answer">{{ item.answer }}</div>
+        <div class="answer">
+          <VueMarkdown :source="item.answer"/>
+        </div>
       </div>
     </div>
     <div class="talk-form">
@@ -53,7 +55,7 @@
 }
 </style>
 <script>
-// import axios from 'axios';
+import VueMarkdown from 'vue-markdown';
 export default {
   data() {
     return {
@@ -61,6 +63,9 @@ export default {
       talkList: [],
     };
   },
+  components: {
+    VueMarkdown,
+  },
   methods: {
     // 发送消息
     async sendMessage() {
@@ -75,7 +80,7 @@ export default {
         method: "POST",
         headers: {
           "Content-Type": "application/json",
-          Authorization: "Bearer 1841e844-275f-4d8f-811b-2b4077e8108f",
+          Authorization: "Bearer 自己的api-key",
         },
         body: JSON.stringify({
           stream: true,