--demand 添加权限

src/App.vue

@@ -18,9 +18,8 @@
     <router-view/>
   </div>
 </template>
-<script>
+<script setup>
-import {computed, defineComponent, ref, onMounted} from "vue";
+import {ref, onMounted} from "vue";
-import {useRouter, useRoute} from "vue-router";
 import {useStore, createStore} from "vuex";
 import NavLeft from "@/components/NavLeft";
 import NavTop from "@/components/NavTop";
@@ -31,147 +30,90 @@ import * as api from "./api/index1";
 import * as api1 from "@/api/index1";
 import * as api2 from "@/api/index";
 
-export default defineComponent({
+const store = useStore();
-  components: {
+const isLogin = ref(false);
-    NavLeft,
+console.log("版本2.1.6------------");
-    NavTop,
-    OpenPages,
-    BreadCrumb,
-  },
-  setup() {
-    const router = useRouter();
-    const route = useRoute();
-    const store = useStore();
-    const isLogin = ref(false);
-    // console.log("router", router.getRoutes(), route);
-    console.log("版本2.1.6------------");
-    const routes = computed(() => {
-      return router.getRoutes().filter((e) => e.meta?.isLink);
-    });
-    // watch(
-    //     () => route.path,
-    //     () => {
-    //       route.path === "/login" && (isLogin.value = true);
-    //     }
-    // );
-    const currentRouteName = computed(() => route.name);
 
-    function init() {
+// 监听关闭浏览器
-      console.log(store);
+let time1 = ref(0);
-      getUserInfo();
+let time2 = ref(0);
-      initDict("faceclassPic");
-      initDict("faceclassClass");
-      initDict("faceclassScene");
-      initDict("projectLevel");
-      initDict("projectSys");
-      initDict("pathmapPic");
-      initDict("projectClass");
-      initDict("projectPic");
-      initDict("sysType");
-      getMemberInfo();
-      getOrgTree();
-    }
 
-    // 监听关闭浏览器
+onMounted(() => {
-    let time1 = ref(0);
+  init()
-    let time2 = ref(0);
+  window.addEventListener('beforeunload', e => beforeunloadHandler(e));
+  window.addEventListener('unload', e => unloadHandler(e));
+})
 
-    //添加监听事件
+//添加监听事件
-    function beforeunloadHandler() {
+function beforeunloadHandler() {
-      time1.value = new Date().getTime();
+  time1.value = new Date().getTime();
-      // e.returnValue = '关闭提示';
+}
-    }
 
-    function unloadHandler() {
+function init() {
-      time2.value = new Date().getTime() - time1.value;
+  getUserInfo();
-      if (time2.value <= 5) {
+  initDict("faceclassPic");
-        store.replaceState(createStore({state: {openpages: null}}).state);
+  initDict("faceclassClass");
-        localStorage.removeItem("openpages");
+  initDict("faceclassScene");
-      }
+  initDict("projectLevel");
-    }
+  initDict("projectSys");
+  initDict("pathmapPic");
+  initDict("projectClass");
+  initDict("projectPic");
+  initDict("sysType");
+  getMemberInfo();
+  getOrgTree();
+}
 
-
+function unloadHandler() {
-    onMounted(() => {
+  time2.value = new Date().getTime() - time1.value;
-      window.addEventListener('beforeunload', e => beforeunloadHandler(e));
+  if (time2.value <= 5) {
-      window.addEventListener('unload', e => unloadHandler(e));
+    store.replaceState(createStore({state: {openpages: null}}).state);
-    })
+    localStorage.removeItem("openpages");
-
-
-    async function getMemberInfo() {
-      const list = localStorage.getItem("memberInitInfo");
-      if (list) {
-        store.commit("SET_MEMBER_INFO", JSON.parse(list));
-        return;
-      }
-      const memberInitInfo = await api1
-          .getMemberInfo({keyWord: "", pageNo: 1, pageSize: 10})
-          .then((res) => res.data.data.rows);
-      store.commit("SET_MEMBER_INFO", memberInitInfo);
-      localStorage.setItem("memberInitInfo", JSON.stringify(memberInitInfo));
-    }
-
-    async function getUserInfo() {
-      const userInfo = await api2.userInfo();
-      store.commit("SET_USER", userInfo.data.data);
-    }
-
-    async function initDict(key, localStory = false) {
-      let list;
-      if (localStory) {
-        list = localStorage.getItem(key);
-        if (list) {
-          store.commit("SET_DICT", {key, data: JSON.parse(list)});
-          return;
-        }
-      }
-      list = await getDictList(key);
-      localStory && localStorage.setItem(key, JSON.stringify(list));
-      store.commit("SET_DICT", {key, data: list});
-    }
-
-    const getDictList = (param) => api1.getDictTree({setCode: param,}).then((res) => res.data.data);
-    //获取组织树
-    const getOrgTree = () => {
-      api.getOrgTreeInfo().then((res) => {
-        store.commit("getOrgtreeList", res.data.data);
-      });
-    };
-    init();
-    return {
-      isLogin,
-      routes,
-      name: currentRouteName,
-      zhCN,
-    };
   }
-});
+}
+
+async function getMemberInfo() {
+  const list = localStorage.getItem("memberInitInfo");
+  if (list) {
+    store.commit("SET_MEMBER_INFO", JSON.parse(list));
+    return;
+  }
+  const memberInitInfo = await api1
+      .getMemberInfo({keyWord: "", pageNo: 1, pageSize: 10})
+      .then((res) => res.data.data.rows);
+  store.commit("SET_MEMBER_INFO", memberInitInfo);
+  localStorage.setItem("memberInitInfo", JSON.stringify(memberInitInfo));
+}
+
+async function getUserInfo() {
+  const userInfo = await api2.userInfo();
+  store.commit("SET_USER", userInfo.data.data);
+}
+
+async function initDict(key, localStory = false) {
+  let list;
+  if (localStory) {
+    list = localStorage.getItem(key);
+    if (list) {
+      store.commit("SET_DICT", {key, data: JSON.parse(list)});
+      return;
+    }
+  }
+  list = await getDictList(key);
+  localStory && localStorage.setItem(key, JSON.stringify(list));
+  store.commit("SET_DICT", {key, data: list});
+}
+
+const getDictList = (param) => api1.getDictTree({setCode: param,}).then((res) => res.data.data);
+//获取组织树
+const getOrgTree = () => {
+  api.getOrgTreeInfo().then((res) => {
+    store.commit("getOrgtreeList", res.data.data);
+  });
+};
 </script>
 <style lang="scss">
-//.ant-modal {
-//
-//  .ant-modal-content {
-//    background-image: linear-gradient(
-//            180deg, rgba(103, 64, 255, .2), rgba(166, 168, 255, 0), rgba(166, 168, 255, 0)) !important;
-//    border-radius: 4px;
-//
-//    .ant-modal-body {
-//      .ant-btn {
-//        border-radius: 8px;
-//        width: 100px;
-//        height: 40px;
-//      }
-//
-//      .ant-btn-primary {
-//        background: #4ea6ff;
-//        color: #fff;
-//      }
-//    }
-//  }
-//}
-
 #app {
-  // font-family: MicrosoftYaHei, Microsoft YaHei, Avenir, Helvetica, Arial,
-  // sans-serif;
   font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
   Microsoft YaHei, Arial, sans-serif;
   -webkit-font-smoothing: antialiased;

src/main.js

@@ -16,6 +16,7 @@ import 'element-plus/dist/index.css'
 import "@/assets/scss/common.scss"
 import Antd from 'ant-design-vue';
 import 'ant-design-vue/dist/antd.css';
+import {vButPer} from "@/utils/directive";
 // import axios from 'axios'
 // axios.defaults.withCredentials = true;
 // import zhCN from 'ant-design-vue/es/locale/zh_CN';
@@ -28,4 +29,5 @@ app.config.warnHandler = () => null;
 app.use(Antd);
 app.use(router);
 app.use(store);
+app.directive('buttonPer', vButPer)
 app.mount('#app');

src/utils/directive.js

@@ -0,0 +1,13 @@
+export const vButPer = {
+    mounted: (el, binding) => {
+        checkPer(binding.value) || el.parentNode.removeChild(el)
+    }
+}
+const admin = [5, 6, 8, 9, 11, 12]
+
+function checkPer(per) {
+    if (!per) {
+        return true
+    }
+    return (per + "").split(',').some(t => admin.some(s => s == t))
+}

src/views/courselibrary/CoursewareManage.vue

@@ -316,16 +316,16 @@
         <template #bodyCell="{ record, column }">
           <template v-if="column.key === 'operation'">
             <a-space>
-              <a-button v-if="record.status===0 || record.status===-1 || !record.kkty" @click="() => handleEdit(record, String(record.courseform))" type="link">编辑</a-button>
+              <a-button v-button-per="record.permissions" v-if="record.status===0 || record.status===-1 || !record.kkty" @click="() => handleEdit(record, String(record.courseform))" type="link">编辑</a-button>
-              <a-button block v-if="record.status===2" @click="() => handleStart(record, String(record.courseform))" type="link">开课</a-button>
+              <a-button v-button-per="record.permissions" block v-if="record.status===2" @click="() => handleStart(record, String(record.courseform))" type="link">开课</a-button>
-              <a-button v-if="record.status===2" @click="() => handleLook(record, String(record.courseform))" type="link">查看</a-button>
+              <a-button v-button-per="record.permissions" v-if="record.status===2" @click="() => handleLook(record, String(record.courseform))" type="link">查看</a-button>
               <a-button v-if="record.status===2" @click="() => handleGuan22(record, String(record.courseform))" type="link">管理</a-button>
-              <DropDown value="授权">
+              <DropDown v-button-per="record.permissions" value="授权">
                 <OwnerTableModelStudent :types="[10,11,12]" :id="record.offcourseId">权限名单</OwnerTableModelStudent>
                 <CommonStudent :type="10" :id="record.offcourseId" title="查看权">查看权</CommonStudent>
                 <CommonStudent :type="11" :id="record.offcourseId" title="管理权">管理权</CommonStudent>
               </DropDown>
-              <DropDown value="更多">
+              <DropDown v-button-per="record.permissions" value="更多">
                 <a-button @click="() => handleCopy(record, String(record.courseform))" type="link">复制</a-button>
                 <a-button @click="() => handleRejectExit(record, String(record.courseform))" type="link">撤回</a-button>
                 <a-button v-if="record.status===2 && record.kkty" @click="() => handleStop(record, String(record.courseform))" type="link">停用</a-button>

src/views/learningpath/LearningPath.vue

@@ -105,16 +105,16 @@
       <template #bodyCell="{ record, column }">
         <template v-if="column.key === 'operation'">
           <a-space>
-            <a-button v-if="record.state==='草稿'" @click="showPub(record)" type="link">发布</a-button>
+            <a-button v-button-per="record.permissions" v-if="record.state==='草稿'" @click="showPub(record)" type="link">发布</a-button>
-            <a-button v-if="record.state==='草稿'" @click="getLearnPathInfo(record.id)" type="link">编辑</a-button>
+            <a-button v-button-per="record.permissions" v-if="record.state==='草稿'" @click="getLearnPathInfo(record.id)" type="link">编辑</a-button>
-            <a-button v-if="record.state==='已发布'" @click="getLearnPathInfo(record.id)" type="link">编辑</a-button>
+            <a-button v-button-per="record.permissions" v-if="record.state==='已发布'" @click="getLearnPathInfo(record.id)" type="link">编辑</a-button>
             <a-button @click="manage(record.id)" type="link">管理</a-button>
-            <DropDown value="授权">
+            <DropDown v-button-per="record.permissions" value="授权">
               <OwnerTableModelStudent :types="[7,8,9]" :id="record.id" :type="9">权限名单</OwnerTableModelStudent>
               <CommonStudent :type="7" :id="record.id" title="查看权">查看权</CommonStudent>
               <CommonStudent :type="8" :id="record.id" title="管理权">管理权</CommonStudent>
             </DropDown>
-            <DropDown value="更多">
+            <DropDown v-button-per="record.permissions" value="更多">
               <a-button @click="showCopyModal(record.id)" type="link">复制</a-button>
               <a-button @click="showDeleteModal(record.id)" type="link" danger>删除</a-button>
               <a-button v-if="record.state==='已发布'" @click="showBackModal(record.id)" type="link">撤回</a-button>

src/views/projectcenter/ProjectManage.vue

@@ -96,26 +96,25 @@
         <template #bodyCell="{ record, column }">
           <template v-if="column.key === 'operation'">
             <a-space align="start">
-              <a-button v-if="record.status===0 || record.status===2 || record.status===-5" @click="handleEdit(record)" type="link">编辑</a-button>
+              <a-button v-button-per="record.permissions" v-if="record.status===0 || record.status===2 || record.status===-5" @click="handleEdit(record)" type="link">编辑</a-button>
-              <a-button v-if="record.type===1" @click="createSub(record)" type="link">创建子项目</a-button>
+              <a-button v-button-per="record.permissions" v-if="record.type===1" @click="createSub(record)" type="link">创建子项目</a-button>
-              <a-button v-if="record.type===2" @click="createClass(record)" type="link">创建班级</a-button>
+              <a-button v-button-per="record.permissions" v-if="record.type===2" @click="createClass(record)" type="link">创建班级</a-button>
-              <a-button v-if="record.status===0 && record.type===3" @click="showReviewModal(record.projectId)" type="link">提交审核</a-button>
+              <a-button v-button-per="record.permissions" v-if="record.status===0 && record.type===3" @click="showReviewModal(record.projectId)" type="link">提交审核</a-button>
-              <a-button v-if="record.status===1 && record.type===3" @click="showRecallReviewModal(record.projectId)" type="link">撤回审核</a-button>
+              <a-button v-button-per="record.permissions" v-if="record.status===1 && record.type===3" @click="showRecallReviewModal(record.projectId)" type="link">撤回审核</a-button>
-              <a-button v-if="record.status===2 && record.type===3" @click="push(record)" type="link">发布</a-button>
+              <a-button v-button-per="record.permissions" v-if="record.status===2 && record.type===3" @click="push(record)" type="link">发布</a-button>
-              <a-button v-if="record.status===3 && record.type===3" @click="showBackModal(record.projectId)" type="link">撤回发布</a-button>
+              <a-button v-button-per="record.permissions" v-if="record.status===3 && record.type===3" @click="showBackModal(record.projectId)" type="link">撤回发布</a-button>
-              <a-button v-if="record.status===3 && record.type===3" @click="manage(record)" type="link">管理</a-button>
+              <a-button v-if="record.status!==3 && record.type===3" @click="baseInfo(record)" type="link">管理</a-button>
-              <DropDown value="授权">
+              <DropDown v-button-per="record.permissions" value="授权">
                 <OwnerTableModelStudent :types="[4,5,6]" :id="record.projectId" :type="6">权限名单</OwnerTableModelStudent>
                 <CommonStudent :type="4" :id="record.projectId" title="查看权">查看权</CommonStudent>
                 <CommonStudent :type="5" :id="record.projectId" title="管理权">管理权</CommonStudent>
               </DropDown>
-              <DropDown value="更多">
+              <DropDown v-button-per="record.permissions" value="更多">
                 <a-button @click="showCopyModal(record.projectId)" type="link">复制</a-button>
                 <a-button v-if="record.status!==3" @click="showDeleteModal(record.projectId)" type="link" danger>删除</a-button>
                 <a-button v-if="record.status===3" @click="showStartModal(record.projectId)" type="link">存为模版</a-button>
                 <a-button v-if="record.status===3 && record.type===3" @click="showStopModal(record.projectId)" type="link">结束</a-button>
                 <a-button v-if="record.status===-1 && record.type===3" @click="showBackFinashModal(record.projectId)" type="link">撤回</a-button>
-                <a-button v-if="record.status!==3 && record.type===3" @click="baseInfo(record)" type="link">基础信息</a-button>
               </DropDown>
             </a-space>
           </template>