feat:添加个人中心

Yi.BBS.Vue3/src/components/ArticleContentInfo.vue

@@ -6,12 +6,15 @@
   
 <script setup>
 import { marked } from 'marked';
+
 import hljs from "highlight.js";
 //可以设置加载样式切换主题
 import 'highlight.js/styles/atom-one-dark.css'
 import '@/assets/github-markdown.css'
 import { ref,watch  } from 'vue';
 
+
+
 const outputHtml=ref("")
 const props = defineProps(['code'])
 watch(props,(n,o)=>{

Yi.BBS.Vue3/src/components/DisscussCard.vue

@@ -44,6 +44,7 @@ const enterDiscuss = (id) => {
 }
 </script>
 <style scoped>
+
 .item-bottom .el-icon {
     margin-right: 0.4rem;
 }

Yi.BBS.Vue3/src/components/MavonEdit.vue

@@ -1,25 +1,61 @@
 <template>
-  <mavon-editor 
-  :v-model="text"
-  :subfield="subfield" 
-  :codeStyle="props.codeStyle" 
-  :ishljs="true"
-  :style="{minHeight:props.height,maxHeight:'100%'}"
-  class="edit"
-  @change="change"
-  ></mavon-editor>
-</template>
-<script setup>
-// Local Registration
+  <mavon-editor ref='md' v-model="text" :subfield="true" :codeStyle="props.codeStyle" :ishljs="true"
+    :style="{ minHeight: props.height, maxHeight: '100%' }" class="edit" @imgAdd="imgAdd">
+    <!-- 引用视频链接的自定义按钮 -->
+    <template v-slot:left-toolbar-after>
+      <!--点击按钮触发的事件是打开表单对话框-->
 
+      <el-dropdown :hide-on-click='false'>
+        <el-button aria-hidden="true" class="op-icon fa" title="表情包">
+          😊
+        </el-button>
+        <template #dropdown>
+          <el-dropdown-menu >
+            <el-dropdown-item>
+              <table border="1">
+                <tr>
+                  <td @click="text+='😊'">😊</td>
+                  <td>😊</td>
+                  <td>😊</td>
+                </tr>
+                <tr>
+                  <td>😊</td>
+                  <td>😊</td>
+                  <td>😊</td>
+                </tr>
+                <tr>
+                  <td>😊</td>
+                  <td>😊</td>
+                  <td>😊</td>
+                </tr>
+              </table>
+
+            </el-dropdown-item>
+
+          </el-dropdown-menu>
+        </template>
+      </el-dropdown>
+
+
+
+
+
+    </template>
+
+  </mavon-editor>
+</template>
+
+
+<script setup>
 import { mavonEditor } from 'mavon-editor'
 import 'mavon-editor/dist/css/index.css'
-import { ref,computed,watch } from 'vue';
-const props = defineProps(['height','modelValue',"codeStyle"])
-const emit=defineEmits(['update:modelValue'])
-const subfield = true;
+import { ref, computed, watch, onMounted } from 'vue';
+import { upload } from '@/apis/fileApi'
+const md = ref(null);
+const props = defineProps(['height', 'modelValue', "codeStyle"])
+const emit = defineEmits(['update:modelValue'])
 
-//v-model传值出去
+// //v-model传值出去
 const text = computed({
   get() {
     return props.modelValue
@@ -29,17 +65,20 @@ const text = computed({
   }
 })
 
-const change=(value ,render)=>
-{
-console.log(value,"value");
-  //不用给解析后htm的值，给value即可
-  emit('update:modelValue', value)
-}
+//图片上传
+const imgAdd = async (pos, $file) => {
+  // 第一步.将图片上传到服务器.
+  var formdata = new FormData();
+  formdata.append('file', $file);
+  const response = await upload(formdata)
+  const url = `${import.meta.env.VITE_APP_BASEAPI}/file/${response[0].id}`;
+  console.log(url)
+  md.value.$img2Url(pos, url);
 
+}
 </script>
 <style scoped>
-.edit
-{
+.edit {
 
   width: 100%;
 }

Yi.BBS.Vue3/src/components/TreeArticleInfo.vue

@@ -15,13 +15,13 @@
           <span>{{data.name}}</span>
           <span>
             
-            <a style="color: #409EFF; margin-left: 8px" @click="$emit('create',node, data)" 
+            <a style="color: #409EFF; margin-left: 8px" @click="$emit('create',node, data)" v-hasPer="['bbs:article:add']"
   
   > + </a>
-            <a style="color: #409EFF; margin-left: 8px" @click="$emit('update',node, data)" 
+            <a style="color: #409EFF; margin-left: 8px" @click="$emit('update',node, data)" v-hasPer="['bbs:article:edit']"
   
   > 编辑 </a>
-            <a style="color: #f56c6c; margin-left: 8px" @click="$emit('remove',node, data)" 
+            <a style="color: #f56c6c; margin-left: 8px" @click="$emit('remove',node, data)" v-hasPer="['bbs:article:remove']"
   
             > 删除 </a>
           </span>