perf:发布权限处理

Yi.Bbs.Vue3/src/components/PlateCard.vue

@@ -1,49 +1,46 @@
 <template>
-    <el-row>
+  <el-row>
-      <el-col
+    <el-col>
-      >
+      <el-card :body-style="{ padding: '0px' }" shadow="never">
-        <el-card :body-style="{ padding: '0px' }" shadow="never">
+        <img src="" class="image" />
-          <img
+        <div style="padding: 14px">
-            src=""
+          <span>{{ props.name }}</span>
-            class="image"
+          <div class="bottom">
-          />
+            <time class="remarks">{{ props.introduction }}</time>
-          <div style="padding: 14px">
+            <RouterLink :to="`/discuss/${props.id}/${props.isPublish}`">
-            <span>{{props.name}}</span>
+              <el-button text class="button" type="primary"
-            <div class="bottom">
+                >进入<el-icon><CaretRight /></el-icon
-              <time class="remarks">{{ props.introduction }}</time>
+              ></el-button>
-              <RouterLink :to="`/discuss/${props.id}`">    <el-button text class="button" type="primary">进入<el-icon><CaretRight /></el-icon></el-button> </RouterLink> 
+            </RouterLink>
-            </div>
           </div>
-        </el-card>
+        </div>
-      </el-col>
+      </el-card>
-    </el-row>
+    </el-col>
-  </template>
+  </el-row>
+</template>
 
-  <script  setup>
+<script setup>
-import { onMounted } from 'vue';
+import { onMounted } from "vue";
 
-const props = defineProps(['name','introduction','id'])
+const props = defineProps(["name", "introduction", "id", "isPublish"]);
+</script>
 
-  </script>
+<style>
+.remarks {
+  font-size: 12px;
+  color: #999;
+}
 
-  <style>
+.bottom {
-  .remarks {
+  margin-top: 13px;
-    font-size: 12px;
+  line-height: 12px;
-    color: #999;
+  display: flex;
-  }
+  justify-content: space-between;
+  align-items: center;
+}
 
-  .bottom {
+.image {
-    margin-top: 13px;
+  width: 100%;
-    line-height: 12px;
+  display: block;
-    display: flex;
+}
-    justify-content: space-between;
+</style>
-    align-items: center;
-  }
-  
-
-  
-  .image {
-    width: 100%;
-    display: block;
-  }
-  </style>

Yi.Bbs.Vue3/src/hooks/useAuths.js

@@ -117,7 +117,7 @@ export default function useAuths(opt) {
     setToken(token);
     try {
       // 存储用户信息
-      await getUserInfo(); // 用户信息
+      await useUserStore().getInfo(); // 用户信息
       // 登录成功后 路由跳转
       // 如果有记录当前跳转页面
       const currentPath = Session.get("currentPath");

Yi.Bbs.Vue3/src/router/index.js

@@ -54,7 +54,7 @@ const router = createRouter({
         },
         {
           name: "discuss",
-          path: "/discuss/:plateId?",
+          path: "/discuss/:plateId?/:isPublish?",
           component: () => import("../views/Discuss.vue"),
           meta: {
             title: "板块",

Yi.Bbs.Vue3/src/stores/user.js

@@ -121,5 +121,9 @@ const useUserStore = defineStore("user", {
       this.id = "";
     },
   },
+  persist: {
+    key: "userInfo",
+    storage: window.sessionStorage,
+  },
 });
 export default useUserStore;

Yi.Bbs.Vue3/src/views/Discuss.vue

@@ -20,7 +20,10 @@
             "
             >查询</el-button
           >
-          <el-button @click="enterEditArticle" type="primary"
+          <el-button
+            @click="enterEditArticle"
+            type="primary"
+            :class="[!isEditArticle ? 'el-button--disabled' : '']"
             >发布主题</el-button
           >
           <el-dropdown>
@@ -99,9 +102,10 @@
 <script setup>
 import DisscussCard from "@/components/DisscussCard.vue";
 import { getList, getTopList } from "@/apis/discussApi.js";
-import { ref, reactive, watch } from "vue";
+import { ref, reactive, watch, computed } from "vue";
 import { useRoute, useRouter } from "vue-router";
 import BottomInfo from "@/components/BottomInfo.vue";
+import useUserStore from "@/stores/user";
 
 //数据定义
 const route = useRoute();
@@ -155,23 +159,31 @@ const loadDiscussList = async () => {
 };
 
 //进入添加主题页面
+const isEditArticle = computed(
+  () =>
+    useUserStore().hasPermissions &&
+    !(route.params.isPublish === "false" ? false : true)
+);
 const enterEditArticle = () => {
-  //跳转路由
+  if (isEditArticle.value) {
-  var routerPer = {
+    //跳转路由
-    path: "/editArt",
+    var routerPer = {
-    query: {
+      path: "/editArt",
-      operType: "create",
+      query: {
-      artType: "discuss",
+        operType: "create",
-      plateId: route.params.plateId,
+        artType: "discuss",
-    },
+        plateId: route.params.plateId,
-  };
+      },
-  router.push(routerPer);
+    };
+    router.push(routerPer);
+  } else {
+    ElMessage.warning("暂无发布权限!");
+  }
 };
 
 watch(
   () => route.query.q,
   async (val) => {
-    console.log(val);
     if (val) {
       query.title = val ?? "";
     }
@@ -245,4 +257,9 @@ watch(
     margin: 0.5rem 0;
   }
 }
+/* 禁用状态下的样式 */
+.el-button.el-button--disabled {
+  opacity: 0.6;
+  pointer-events: auto;
+}
 </style>

Yi.Bbs.Vue3/src/views/home/Index.vue

@@ -19,6 +19,7 @@
               :name="i.name"
               :introduction="i.introduction"
               :id="i.id"
+              :isPublish="i.isDisableCreateDiscuss"
             />
           </el-col>