feat:增加学习路径及项目发布的统计,增加组织树

src/App.vue

@@ -18,11 +18,13 @@
 <script>
 import { computed, defineComponent } from "vue";
 import { useRouter, useRoute } from "vue-router";
+import { useStore } from "vuex";
 import NavLeft from "@/components/NavLeft";
 import NavTop from "@/components/NavTop";
 import OpenPages from "@/components/OpenPages";
 import BreadCrumb from "@/components/BreadCrumb";
 import zhCN from "ant-design-vue/es/locale/zh_CN";
+import * as api from "./api/index1";
 export default defineComponent({
   components: {
     NavLeft,
@@ -33,13 +35,28 @@ export default defineComponent({
   setup() {
     const router = useRouter();
     const route = useRoute();
+    const store = useStore();
     // console.log("router", router.getRoutes(), route);
     const routes = computed(() => {
       return router.getRoutes().filter((e) => e.meta?.isLink);
     });
 
     const currentRouteName = computed(() => route.name);
-
+    //获取组织树
+    const orgTree = () => {
+      api
+        .orgtree()
+        .then((res) => {
+          console.log("获取集团组织成功", res);
+          if (res.status === 200) {
+            store.commit("getOrgtreeList", res.data.data);
+          }
+        })
+        .catch((err) => {
+          console.log("获取集团组织失败", err);
+        });
+    };
+    orgTree();
     return {
       routes,
       name: currentRouteName,

src/api/index.js

@@ -2,7 +2,7 @@
  * @Author: lixg lixg@dongwu-inc.com
  * @Date: 2022-11-07 17:06:45
  * @LastEditors: lixg lixg@dongwu-inc.com
- * @LastEditTime: 2022-11-15 16:43:26
+ * @LastEditTime: 2022-11-20 17:45:37
  * @FilePath: /fe-manage/src/api/index.js
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -54,9 +54,9 @@ export const getProjectList = (obj) => http.post('/admin/project/list', obj)
 // 获取项目详情信息（包含阶段及任务列表）
 export const getProjectDetail = (obj) => http.get('/admin/project/detail', { params: obj })
 //发布项目
-export const releaseProject=(obj)=>http.post('/admin/project/publish',obj)
+export const releaseProject = (obj) => http.post('/admin/project/publish', obj)
 //获取项目学员
-export const projectStudent=(obj)=>http.post('/admin/project/studentList',obj)
+export const projectStudent = (obj) => http.post('/admin/project/studentList', obj)
 //撤回发布、结束
 export const handleProject = (obj) => http.post('/admin/project/handle', obj)
 
@@ -65,7 +65,9 @@ export const taskStudentList = (obj) => http.post('/admin/project/taskStudentLis
 
 
 //获取讨论信息
-export const getDiscussDetail=(obj)=>http.post('/discuss/getDiscussDetail',obj)
+export const getDiscussDetail = (obj) => http.post('/discuss/getDiscussDetail', obj)
 
 //获取模版列表
-export const getTemplate=(obj)=>http.post('/admin/project/template/list',obj)
+export const getTemplate = (obj) => http.post('/admin/project/template/list', obj)
+//获取项目统计
+export const getProjectCount = (projectId) => http.get('/admin/project/projectCount', { params: { projectId: projectId } })

src/api/index1.js

@@ -2,7 +2,7 @@
  * @Author: lixg lixg@dongwu-inc.com
  * @Date: 2022-11-04 22:45:31
  * @LastEditors: lixg lixg@dongwu-inc.com
- * @LastEditTime: 2022-11-18 14:24:33
+ * @LastEditTime: 2022-11-20 15:39:38
  * @FilePath: /fe-manage/src/api/index1.js
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -53,7 +53,8 @@ export const createLearnPath = (obj) => http.post('/admin/router/edit', obj);
 export const getLearnPath = (obj) => http.post('/admin/router/list', obj);
 //学习路径图的发布、停用、删除
 export const handleLearnPath = (obj) => http.post('/admin/router/handle', obj);
-
+//获取路径图统计数据
+export const getLearnCount = (routerId) => http.get('/admin/router/getCount', { params: { routerId: routerId } })
 //获取关卡
 export const getChapter = (obj) => http.post('/admin/router/detail', { params: obj });
 
@@ -83,6 +84,12 @@ export const scoreRank = (obj) => http.post('/admin/project/scoreRank', obj);
 export const billboard = (obj) => http.post('/admin/project/billboard', obj);
 //项目基础信息-----------------------------------
 
+
+// 获取组织结构树
+export const orgtree = () => http.get('/org/tree');
+
+
+
 // 测试方法
 // import * as api from '../../api/index'
 // api.getLearnPath({}).then(res => {

src/api/method.js

@@ -162,211 +162,13 @@ function autoComma(number) {
 		return 0;
 	}
 }
-const commonData={
+const commonData = {
-	timeout:50
+	timeout: 50
 }
 
 
 //组织树
-const  organizationalTree= [
+const organizationalTree = []
-	{
-		title: "京东方",
-		value: "京东方",
-		children: [
-			{
-				title: "产研部",
-				value: "产研部",
-				children: [
-					{
-						title: "产品部",
-						value: "产品部",
-					},
-					{
-						title: "研究部",
-						value: "研究部",
-					},
-					{
-						title: "研究部2",
-						value: "研究部2",
-					},
-					{
-						title: "研究3",
-						value: "研究3",
-					},
-					{
-						title: "研究4",
-						value: "研究4",
-					},
-					{
-						title: "研究部5",
-						value: "研究部5",
-					},
-					{
-						title: "研究部6",
-						value: "研究部6",
-					},
-					{
-						title: "研究部7",
-						value: "研究部7",
-					},
-					{
-						title: "研究部8",
-						value: "研究部8",
-					},
-					{
-						title: "研究部9",
-						value: "研究部9",
-					},
-				],
-			},
-			{
-				title: "二级标题",
-				value: "二级标题",
-				children: [
-					{
-						title: "三级标题",
-						value: "三级标题",
-						children: [
-							{
-								title: "四级标题",
-								value: "四级标题",
-								children: [
-									{
-										title: "五级标题",
-										value: "五级标题",
-										children: [
-											{
-												title: "六级标题",
-												value: "六级标题",
-												children: [
-													{
-														title: "七级标题",
-														value: "七级标题",
-														children: [
-															{
-																title: "八级标题",
-																value: "八级标题",
-																children: [
-																	{
-																		title: "九级标题",
-																		value: "九级标题",
-																		children: [
-																			{
-																				title: "十级标题",
-																				value: "十级标题",
-																				children: [
-																					{
-																						title: "十一级标题",
-																						value: "十一级标题",
-																						children: [
-																							{
-																								title: "十二级标题",
-																								value: "十二级标题",
-																								children: [
-																									{
-																										title:
-																											"十三级标题十三级标题十三级标题十三级标题",
-																										value: "十三级标题",
-																										children: [
-																											{
-																												title:
-																													"十四级标题",
-																												value:
-																													"十四级标题",
-																												children: [
-																													{
-																														title:
-																															"十五级标题",
-																														value:
-																															"十五级标题",
-																														children: [
-																															{
-																																title:
-																																	"十六级标题",
-																																value:
-																																	"十六级标题",
-																																children:
-																																	[
-																																		{
-																																			title:
-																																				"十七级标题",
-																																			value:
-																																				"十七级标题",
-																																			children:
-																																				[
-																																					{
-																																						title:
-																																							"十八级标题",
-																																						value:
-																																							"十八级标题",
-																																						children:
-																																							[
-																																								{
-																																									title:
-																																										"十九级标题",
-																																									value:
-																																										"十九级标题",
-																																									children:
-																																										[
-																																											{
-																																												title:
-																																													"二十级标题二十级标题",
-																																												value:
-																																													"二十级标题二十级标题",
-																																											},
-																																										],
-																																								},
-																																							],
-																																					},
-																																				],
-																																		},
-																																	],
-																															},
-																														],
-																													},
-																												],
-																											},
-																										],
-																									},
-																								],
-																							},
-																						],
-																					},
-																				],
-																			},
-																		],
-																	},
-																],
-															},
-														],
-													},
-												],
-											},
-										],
-									},
-								],
-							},
-						],
-					},
-				],
-			},
-			{
-				title: "人力资源部",
-				value: "人力资源部",
-				children: [
-					{
-						title: "人事部",
-						value: "人事部",
-					},
-					{
-						title: "行政部",
-						value: "行政部",
-					},
-				],
-			},
-		],
-	},
-]
 export {
 	toDate,
 	getWeek,

src/components/drawers/UnlockMode.vue

@@ -18,7 +18,7 @@
       <div class="main">
         <div class="classify">
           <div
-            v-for="item, index in classify"
+            v-for="(item, index) in classify"
             :key="index"
             class="classifyItem"
             @click="selectClassify(item)"
@@ -35,28 +35,41 @@
             {{ item.text }}
           </div>
         </div>
-<div v-if="selectClassifyType===1" class="type1">
+        <div v-if="selectClassifyType === 1" class="type1">
-  <span style="font-weight: 500">描述：</span><span>不设学习限制，学员可以在任何时间学习</span>
+          <span style="font-weight: 500">描述：</span
-</div>
+          ><span>不设学习限制，学员可以在任何时间学习</span>
-   <div v-if="selectClassifyType===2" class="type1 type2">
+        </div>
-  <div><span style="font-weight: 500">描述：</span><span>辩论、活动、测评、调研、投票按照设置时间</span></div>
+        <div v-if="selectClassifyType === 2" class="type1 type2">
-<div class="radio">
+          <div>
-  <span>解锁单元：</span>
+            <span style="font-weight: 500">描述：</span
-  <a-radio v-model:checked="checked">逐个任务解锁</a-radio>
+            ><span>辩论、活动、测评、调研、投票按照设置时间</span>
-</div>
+          </div>
-</div>    
+          <div class="radio">
-   <div v-if="selectClassifyType===3" class="type1 type3">
+            <span>解锁单元：</span>
-  <div><span style="font-weight: 500">描述：</span><span>前一个阶段达成目标后解锁下一个阶段</span></div>
+            <a-radio v-model:checked="checked">逐个任务解锁</a-radio>
-<div class="radio" style="display:flex">
+          </div>
- <div style="margin-top:1px">解锁条件：</div>
+        </div>
-   <a-radio-group v-model:value="radioSelect">
+        <div v-if="selectClassifyType === 3" class="type1 type3">
-   <div><a-radio :value="1">逐个任务解锁，完成一个任务后解锁下一个</a-radio></div>
+          <div>
-  <div style="margin-top:24px"> <a-radio :value="2">完成当前阶段所有必修任务解锁下一阶段</a-radio></div>
+            <span style="font-weight: 500">描述：</span
- 
+            ><span>前一个阶段达成目标后解锁下一个阶段</span>
-  </a-radio-group>
+          </div>
-  
+          <div class="radio" style="display: flex">
-</div>
+            <div style="margin-top: 1px">解锁条件：</div>
-</div>  
+            <a-radio-group v-model:value="radioSelect">
+              <div>
+                <a-radio :value="1"
+                  >逐个任务解锁，完成一个任务后解锁下一个</a-radio
+                >
+              </div>
+              <div style="margin-top: 24px">
+                <a-radio :value="2"
+                  >完成当前阶段所有必修任务解锁下一阶段</a-radio
+                >
+              </div>
+            </a-radio-group>
+          </div>
+        </div>
       </div>
       <div class="btnn">
         <button class="btn1">取消</button>
@@ -92,11 +105,14 @@ export default {
           text: "闯关模式",
         },
       ],
-      selectClassifyType: 3,
+      selectClassifyType: 1,
-      checked:true,
+      checked: true,
-      radioSelect:1,
+      radioSelect: 1,
     });
     const closeDrawer = () => {
+      state.selectClassifyType = 1;
+      state.checked = true;
+      state.radioSelect = 1;
       ctx.emit("update:unlockModeVisible", false);
     };
 
@@ -163,14 +179,14 @@ export default {
           cursor: pointer;
         }
       }
-      .type1{
+      .type1 {
         margin-top: 50px;
-font-size: 14px;
+        font-size: 14px;
-font-weight: 400;
+        font-weight: 400;
-color: #333333;
+        color: #333333;
-line-height: 20px;
+        line-height: 20px;
       }
-      .radio{
+      .radio {
         margin-top: 24px;
       }
     }

src/store/index.js

@@ -1,3 +1,11 @@
+/*
+ * @Author: lixg lixg@dongwu-inc.com
+ * @Date: 2022-11-09 09:26:26
+ * @LastEditors: lixg lixg@dongwu-inc.com
+ * @LastEditTime: 2022-11-20 16:06:52
+ * @FilePath: /fe-manage/src/store/index.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 import { createStore } from "vuex";
 
 export default createStore({
@@ -5,15 +13,17 @@ export default createStore({
     openpages: localStorage.getItem("openpages")
       ? JSON.parse(localStorage.getItem("openpages"))
       : [
-          {
+        {
-            pagename: "学习路径",
+          pagename: "学习路径",
-            href: "/learningpath",
+          href: "/learningpath",
-            active: true,
+          active: true,
-          },
+        },
-        ],
+      ],
 
     assessmentName: "",
     routerId: null,
+
+    orgtreeList: [],
   },
   getters: {},
   mutations: {
@@ -31,6 +41,9 @@ export default createStore({
       console.log("state.assessmentName");
       console.log(state.assessmentName);
     },
+    getOrgtreeList(state, orgtreeList) {
+      state.orgtreeList = orgtreeList;
+    }
   },
   actions: {},
   modules: {},

src/views/learningpath/LearningPath.vue

@@ -118,7 +118,7 @@
     <a-modal
       :closable="sh"
       centered="true"
-    v-model:visible="out"
+      v-model:visible="out"
       :footer="null"
       wrapClassName="CreatePath"
     >
@@ -194,7 +194,7 @@
             <img class="im" src="../../assets/px.jpg" /> -->
               <div
                 @click="chooseImg(item)"
-                v-for="item,index in imgData"
+                v-for="(item, index) in imgData"
                 :key="item.key"
                 class="learnBgItem"
                 :style="{
@@ -203,10 +203,14 @@
                       ? '2px solid rgba(78, 166, 255, 1)'
                       : '1px solid #C7CBD2',
                   'background-image': 'url(' + item.source + ')',
-                   display:index>=5?'none':'flex'
+                  display: index >= 5 ? 'none' : 'flex',
                 }"
               ></div>
-              <div @click="showLearnBgMore" v-if="imgData.length > 5" class="learnBgItem learnBgMore">
+              <div
+                @click="showLearnBgMore"
+                v-if="imgData.length > 5"
+                class="learnBgItem learnBgMore"
+              >
                 查看更多 <img src="../../assets/images/projectadd/go.png" />
               </div>
             </div>
@@ -313,7 +317,7 @@
             <img class="im" src="../../assets/px.jpg" /> -->
               <div
                 @click="chooseImg2(item)"
-                v-for="(item,index) in imgData"
+                v-for="(item, index) in imgData"
                 :key="item.key"
                 class="learnBgItem"
                 :style="{
@@ -322,12 +326,16 @@
                       ? '2px solid rgba(78, 166, 255, 1)'
                       : '1px solid #ccc',
                   'background-image': 'url(' + item.source + ')',
-                  display:index>=5?'none':'flex'
+                  display: index >= 5 ? 'none' : 'flex',
                 }"
               >
                 <!-- <img class="im" :src="item.source" /> -->
               </div>
-               <div @click="showLearnBgMore" v-if="imgData.length > 5" class="learnBgItem learnBgMore">
+              <div
+                @click="showLearnBgMore"
+                v-if="imgData.length > 5"
+                class="learnBgItem learnBgMore"
+              >
                 查看更多 <img src="../../assets/images/projectadd/go.png" />
               </div>
             </div>
@@ -392,7 +400,9 @@
         <div class="projectbox">
           <div class="promessage">
             <div class="messageme">路径信息</div>
-            <div class="messagege">当前路径共0个关卡，0个任务</div>
+            <div class="messagege">
+              当前路径共{{ routeChapters }}个关卡，{{ routeTasks }}个任务
+            </div>
           </div>
           <div class="stumessage">
             <div class="messageme1">学员信息</div>
@@ -618,13 +628,11 @@
           >
             <!-- <img class="im" :src="item.source" /> -->
           </div>
-
-          
         </div>
         <div class="btn">
-            <button class="samtn btn1" @click="closeLearnBgMore">取消</button>
+          <button class="samtn btn1" @click="closeLearnBgMore">取消</button>
-            <button class="samtn btn2" @click="closeLearnBgMore">确定</button>
+          <button class="samtn btn2" @click="closeLearnBgMore">确定</button>
-          </div>
+        </div>
       </div>
     </a-modal>
   </div>
@@ -695,7 +703,8 @@ export default {
         {
           id: 7,
           source: require("../../assets/images/leveladd/2.png"),
-        }, {
+        },
+        {
           id: 5,
           source: require("../../assets/images/leveladd/3.png"),
         },
@@ -706,7 +715,8 @@ export default {
         {
           id: 7,
           source: require("../../assets/images/leveladd/2.png"),
-        }, {
+        },
+        {
           id: 5,
           source: require("../../assets/images/leveladd/3.png"),
         },
@@ -717,7 +727,8 @@ export default {
         {
           id: 7,
           source: require("../../assets/images/leveladd/2.png"),
-        }, {
+        },
+        {
           id: 5,
           source: require("../../assets/images/leveladd/3.png"),
         },
@@ -728,7 +739,8 @@ export default {
         {
           id: 7,
           source: require("../../assets/images/leveladd/2.png"),
-        }, {
+        },
+        {
           id: 5,
           source: require("../../assets/images/leveladd/3.png"),
         },
@@ -739,7 +751,8 @@ export default {
         {
           id: 7,
           source: require("../../assets/images/leveladd/2.png"),
-        }, {
+        },
+        {
           id: 5,
           source: require("../../assets/images/leveladd/3.png"),
         },
@@ -836,7 +849,9 @@ export default {
       endTime: null, //结束时间
       //发布---------------
       releasePathId: null, //发布路径id
-      routeStudentsNum: 0,
+      routeStudentsNum: 0, //学员总数
+      routeChapters: 0, //关卡总数
+      routeTasks: 0, //任务总数
       recallPathId: null, //撤回路径id
       stopPathId: null, //停用路径id
       copyPathId: null, //复制路径iid
@@ -881,32 +896,19 @@ export default {
     const showPub = (routerId) => {
       state.pub = true;
       state.releasePathId = routerId;
-      //获取学员总数
-      let obj = {
-        pageNo: 0,
-        pageSize: 0,
-        routerId: routerId,
-      };
       api
-        .getStudent(obj)
+        .getLearnCount(routerId)
         .then((res) => {
           if (res.status === 200) {
-            // console.log("res", res.data.data);
+            // console.log("获取关卡、任务、学员统计数据", res.data);
-            state.routeStudentsNum = res.data.data.total;
+            state.routeStudentsNum = res.data.students;
+            state.routeChapters = res.data.chapters;
+            state.routeTasks = res.data.tasks;
           }
         })
         .catch((err) => {
           console.log("err", err);
         });
-      //获取学习路径详细信息
-      api
-        .getRouterDetail(routerId)
-        .then((res) => {
-          console.log("学习路径详情", res);
-        })
-        .catch((err) => {
-          console.log("学习路径详情获取错误", err);
-        });
     };
     //确定发布
     const releaseLearnPath = () => {
@@ -1641,6 +1643,7 @@ export default {
       // console.log("执行");
       getLearnPath();
     });
+
     return {
       ...toRefs(state),
       selectProjectName,
@@ -1912,70 +1915,69 @@ export default {
         width: 680px !important;
         height: 528px !important;
         padding: 0 !important;
-       .main{
+        .main {
-        display: flex;
-        flex-direction: column;
-         .top {
-          padding-left: 51px;
-          padding-right: 51px;
-          padding-top: 28px;
           display: flex;
-          align-items: center;
+          flex-direction: column;
-          justify-content: space-between;
+          .top {
-          cursor: pointer;
+            padding-left: 51px;
-          .topc {
+            padding-right: 51px;
-            font-size: 16px;
+            padding-top: 28px;
-            font-weight: bold;
+            display: flex;
-            color: #000000;
+            align-items: center;
-            line-height: 36px;
+            justify-content: space-between;
-          }
+            cursor: pointer;
-        }
+            .topc {
-        .imagesBox{
+              font-size: 16px;
-          display: flex;
+              font-weight: bold;
-        //  justify-content: space-between;
+              color: #000000;
-        flex-wrap: wrap;
+              line-height: 36px;
-           padding-left: 51px;
-          padding-right: 39px;
-          margin-top: 20px;
-          height: 350px;
-          overflow-y: auto;
-          .learnBgItem{
-              border-radius: 8px;
-                  width: 136px;
-                  height: 106px;
-                  background-size: 100%;
-                  background-repeat: no-repeat;
-                  margin-bottom: 20px;
-                  margin-right: 10px;
-          }
-
-        }
-         .btn {
-          width: 100%;
-             position: absolute;
-             bottom:30px ;
-              margin-top: 30px;
-              display: flex;
-             justify-content: center;
-              .samtn {
-                width: 100px;
-                height: 40px;
-                font-size: 14px;
-                border: 1px solid #4ea6ff;
-                border-radius: 8px;
-                cursor: pointer;
-              }
-              .btn1 {
-                background-color: #fff;
-                color: #4ea6ff;
-              }
-              .btn2 {
-                background-color: #4ea6ff;
-                color: #fff;
-                margin-left: 16px;
-              }
             }
-       }
+          }
+          .imagesBox {
+            display: flex;
+            //  justify-content: space-between;
+            flex-wrap: wrap;
+            padding-left: 51px;
+            padding-right: 39px;
+            margin-top: 20px;
+            height: 350px;
+            overflow-y: auto;
+            .learnBgItem {
+              border-radius: 8px;
+              width: 136px;
+              height: 106px;
+              background-size: 100%;
+              background-repeat: no-repeat;
+              margin-bottom: 20px;
+              margin-right: 10px;
+            }
+          }
+          .btn {
+            width: 100%;
+            position: absolute;
+            bottom: 30px;
+            margin-top: 30px;
+            display: flex;
+            justify-content: center;
+            .samtn {
+              width: 100px;
+              height: 40px;
+              font-size: 14px;
+              border: 1px solid #4ea6ff;
+              border-radius: 8px;
+              cursor: pointer;
+            }
+            .btn1 {
+              background-color: #fff;
+              color: #4ea6ff;
+            }
+            .btn2 {
+              background-color: #4ea6ff;
+              color: #fff;
+              margin-left: 16px;
+            }
+          }
+        }
       }
     }
   }

src/views/projectcenter/ProjectAdd.vue

@@ -169,7 +169,34 @@
           </div>
 
           <div class="in select">
-            <a-select
+            <a-tree-select
+              :getPopupContainer="
+                (triggerNode) => {
+                  return triggerNode.parentNode || document.body;
+                }
+              "
+              v-model:value="classifySelect2"
+              style="width: 100%"
+              :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+              placeholder="自动带出 可修改"
+              allow-clear
+              tree-default-expand-all
+              :tree-data="classifyList2"
+              :fieldNames="{
+                children: 'children',
+                label: 'name',
+                value: 'id',
+              }"
+              :disabled="viewDetail ? true : false"
+              @change="classificationChange2"
+              dropdownClassName="treeDropdown"
+            >
+              <!-- <template #title="{ value: val, title }">
+      <b v-if="val === 'parent 1-1'" style="color: #08c">sss</b>
+      <template v-else>{{ title }}</template>
+    </template> -->
+            </a-tree-select>
+            <!-- <a-select
               :getPopupContainer="
                 (triggerNode) => {
                   return triggerNode.parentNode || document.body;
@@ -179,8 +206,9 @@
               placeholder="自动带出 可修改"
               :options="classifyList2"
               @change="classificationChange2"
+              :field-names="{ label: 'name', value: 'id', options: 'children' }"
               :disabled="viewDetail ? true : false"
-            />
+            /> -->
           </div>
         </div>
         <div class="name name2">
@@ -359,22 +387,24 @@
   </div>
 </template>
 <script>
-import { reactive, toRefs, ref, onUnmounted } from "vue";
+import { reactive, toRefs, ref, onUnmounted, computed } from "vue";
 import { message } from "ant-design-vue";
 import { useRouter, useRoute } from "vue-router";
 import dayjs from "dayjs";
 import * as api from "../../api/index";
+// import * as api1 from "../../api/index1";
 import { storage } from "../../api/storage";
 import { toDate } from "../../api/method";
-
+import { useStore } from "vuex";
 export default {
   name: "projectAdd",
   setup() {
+    const store = useStore();
     // 编辑页面跳转过来时候，自动填充表格
     const routers = useRoute();
     const isEdit = ref(false);
     let peojectID = "";
-
+    console.log("store.state.orgtreeList", store.state.orgtreeList);
     if (routers.query.projectId) {
       storage.set("projectAddId", routers.query.projectId);
       isEdit.value = true;
@@ -515,7 +545,7 @@ export default {
       valueE1: null,
       valueE2: null,
       classifySelect1: [],
-      classifySelect2: [],
+      classifySelect2: null,
       classifySelect3: [],
       classifySelect4: [],
       rangevalue: [],
@@ -690,11 +720,25 @@ export default {
     };
 
     // 资源归属 sourceBelongId 后续给接口
-    const classifyList2 = ref([
+    const classifyList2 = computed(() => {
-      { value: 1, label: "项目一" },
+      return store.state.orgtreeList ? store.state.orgtreeList : ref(null);
-      { value: 2, label: "项目二" },
+    });
-      { value: 3, label: "项目三" },
+
-    ]);
+    // //获取资源归属
+    // const orgTree = () => {
+    //   api1
+    //     .orgtree()
+    //     .then((res) => {
+    //       console.log("获取集团组织成功", res);
+    //       if (res.status === 200) {
+    //         classifyList2.value = res.data.data;
+    //       }
+    //     })
+    //     .catch((err) => {
+    //       console.log("获取集团组织失败", err);
+    //     });
+    // };
+    // orgTree();
 
     let sourceBelongIdC = "";
     const classificationChange2 = (key) => {
@@ -1357,4 +1401,18 @@ export default {
     }
   }
 }
+.treeDropdown {
+  // width: 240px !important;
+  // border-radius: 5px;
+  // min-height: 600px !important;
+  .ant-select-tree-list-scrollbar {
+    width: 5px !important;
+    .ant-select-tree-list-scrollbar-thumb {
+      background-color: #4ea6ff !important;
+    }
+  }
+  .ant-select-tree-indent-unit {
+    width: 7px !important;
+  }
+}
 </style>

src/views/projectcenter/ProjectManage.vue

@@ -968,7 +968,9 @@
         <div class="projectbox">
           <div class="promessage">
             <div class="messageme">项目信息</div>
-            <div class="messagege">当前项目共0个阶段，0个任务</div>
+            <div class="messagege">
+              当前项目共{{ projectStages }}个阶段，{{ projectTasks }}个任务
+            </div>
           </div>
           <div class="stumessage">
             <div class="messageme1">学员信息</div>
@@ -1024,8 +1026,8 @@
         </div>
       </div>
     </a-modal>
-<!-- 创建项目提示框 -->
+    <!-- 创建项目提示框 -->
- <a-modal
+    <a-modal
       v-model:visible="reminderModal"
       :footer="null"
       :closable="closeBack"
@@ -1041,7 +1043,9 @@
             <div class="close_exit" @click="closeReminderModal"></div>
           </div>
           <div class="body">
-            <div style="margin-left:60px;margin-right:60px">请您根据自身需求选择对应项目类别，多层项目与单层项目操作不同，层级不同</div>
+            <div style="margin-left: 60px; margin-right: 60px">
+              请您根据自身需求选择对应项目类别，多层项目与单层项目操作不同，层级不同
+            </div>
           </div>
           <div class="del_btnbox">
             <div class="del_btn btn2" @click="okReminderModal">
@@ -1052,7 +1056,6 @@
       </div>
     </a-modal>
 
-
     <!-- 归属权抽屉 -->
     <proj-owner-ship v-model:ProjOwnervisible="ProjOwnervisible" />
     <!-- 授权名单抽屉 -->
@@ -1061,9 +1064,6 @@
     <proj-check-ship v-model:ProjCheckvisible="ProjCheckvisible" />
     <!-- 管理权抽屉 -->
     <proj-manage-ship v-model:ProjManagevisible="ProjManagevisible" />
-
-
-
   </div>
 </template>
 <script>
@@ -1101,7 +1101,7 @@ export default {
       projectPub: false, //发布弹窗
       backModal: false, //撤回弹窗
       closeBack: false, //撤回弹窗关闭图标
-      reminderModal:false,//温馨提示弹窗
+      reminderModal: false, //温馨提示弹窗
       ProjOwnervisible: false,
       ProjPvisible: false,
       ProjCheckvisible: false,
@@ -1118,7 +1118,9 @@ export default {
       tableDataTotal: -1, //学习路径列表总数
       pageSize: 10, //每页10条数据
 
-      projectStudentsNum: 0, //发布弹窗-学员人数
+      projectStudentsNum: 0, //发布弹窗-学员人
+      projectStages: 0,
+      projectTasks: 0,
       releaseProjectId: null, //发布的项目id
       releaseProjectName: null, //发布的项目名称
       releaseProjectTime: null, //发布的项目时间
@@ -1800,26 +1802,39 @@ export default {
       state.releaseProjectName = object.name;
       state.releaseProjectTime = object.time;
       console.log("object", object);
-      //获取学员总数
-      let obj = {
-        pageNo: 0,
-        pageSize: 0,
-        projectId: object.projectId,
-      };
       api
-        .projectStudent(obj)
+        .getProjectCount(object.projectId)
         .then((res) => {
           if (res.status === 200) {
-            // console.log("res", res.data);
+            console.log("获取关卡、任务、学员统计数据", res.data);
-            state.projectStudentsNum = res.data.data.total
+            state.projectStudentsNum = res.data.students;
-              ? res.data.data.total
+            state.projectStages = res.data.stages;
-              : 0;
+            state.projectTasks = res.data.tasks;
           }
         })
         .catch((err) => {
-          console.log("获取学员人数失败", err);
+          console.log("err", err);
         });
-      //获取阶段及任务总数
+      // //获取学员总数
+      // let obj = {
+      //   pageNo: 0,
+      //   pageSize: 0,
+      //   projectId: object.projectId,
+      // };
+      // api
+      //   .projectStudent(obj)
+      //   .then((res) => {
+      //     if (res.status === 200) {
+      //       // console.log("res", res.data);
+      //       state.projectStudentsNum = res.data.data.total
+      //         ? res.data.data.total
+      //         : 0;
+      //     }
+      //   })
+      //   .catch((err) => {
+      //     console.log("获取学员人数失败", err);
+      //   });
+      // //获取阶段及任务总数
     };
     //确认发布项目
     const releaseProject = () => {
@@ -3071,8 +3086,7 @@ export default {
     };
 
     const showModal1 = () => {
-     
+      state.reminderModal = true;
-     state.reminderModal=true
     };
     const closeModal1 = () => {
       state.estabish = false;
@@ -3101,14 +3115,13 @@ export default {
       state.ProjManagevisible = true;
     };
 
-const closeReminderModal=()=>{
+    const closeReminderModal = () => {
-  state.reminderModal=false
+      state.reminderModal = false;
-   
+    };
-}
+    const okReminderModal = () => {
-const okReminderModal=()=>{
+      state.reminderModal = false;
-  state.reminderModal=false
+      state.estabish = true;
-  state.estabish = true;
+    };
-}
     return {
       ...toRefs(state),
       selectProjectName,

src/views/projectcenter/TaskAdd.vue

@@ -138,11 +138,11 @@
                 <div class="inputbox">
                   <input type="text" placeholder="按学习时间解锁" />
                   <!-- v-model:unlockModeVisible="unlockModeVisible" -->
-                  <div class="bottonbox"  @click="showModeVisible">
+                  <div class="bottonbox" @click="showModeVisible">
                     <div class="btnText">切换模式</div>
                   </div>
-                   <!-- 切换模式抽屉 -->
+                  <!-- 切换模式抽屉 -->
-    <unlock-mode v-model:unlockModeVisible="unlockModeVisible" />
+                  <unlock-mode v-model:unlockModeVisible="unlockModeVisible" />
                 </div>
               </div>
               <div class="line"></div>
@@ -992,9 +992,8 @@
       </div></a-modal
     >
 
-
+    <!-- 是否删除阶段弹窗 -->
-      <!-- 是否删除阶段弹窗 -->
+    <a-modal
-        <a-modal
       v-model:visible="deleteStageModal"
       :footer="null"
       :closable="cC"
@@ -1014,18 +1013,15 @@
           </div>
           <div class="del_btnbox">
             <div class="del_btn btn1" @click="closeDeleteStage">
-              <div class="btnText" >取消</div>
+              <div class="btnText">取消</div>
             </div>
             <div class="del_btn btn2" @click="deleteStage">
-              <div class="btnText" >确定</div>
+              <div class="btnText">确定</div>
             </div>
           </div>
         </div>
       </div>
     </a-modal>
-
-
-   
   </div>
 </template>
 
@@ -1050,7 +1046,7 @@ import * as apistage from "../../api/indexStage";
 import * as apimove from "../../api/indexMovetask";
 import draggable from "vuedraggable";
 import { storage } from "../../api/storage";
-import UnlockMode from '../../components/drawers/UnlockMode.vue'
+import UnlockMode from "../../components/drawers/UnlockMode.vue";
 const drawercolumns = [
   {
     title: "项目名称",
@@ -1296,10 +1292,10 @@ export default {
       selectAll: 0, //0：未选择，1：全选，2：部分选择
 
       updateStageID: null, //编辑阶段id
-      deleteStageId:null,//删除阶段的id
+      deleteStageId: null, //删除阶段的id
-      deleteStageModal:false,//删除阶段弹窗
+      deleteStageModal: false, //删除阶段弹窗
 
-unlockModeVisible:false,//切换模式抽屉
+      unlockModeVisible: false, //切换模式抽屉
     });
     console.log("projectId", state.projectId);
     const selectProjectName = (value, index) => {
@@ -1728,7 +1724,7 @@ unlockModeVisible:false,//切换模式抽屉
             console.log("修改阶段成功", res);
             state.valuesname = "";
             state.valuesnotice = "";
-           closeModal()
+            closeModal();
             state.updateStageID = null;
             message.destroy();
             message.success("修改阶段成功");
@@ -1747,9 +1743,9 @@ unlockModeVisible:false,//切换模式抽屉
           .editStage(obj)
           .then((res) => {
             console.log("添加阶段成功", res);
-            state.valuesname = ""
+            state.valuesname = "";
-              state.valuesnotice = ""
+            state.valuesnotice = "";
-             closeModal()
+            closeModal();
             message.destroy();
             message.success("添加阶段成功");
             getTask();
@@ -1760,19 +1756,17 @@ unlockModeVisible:false,//切换模式抽屉
       }
     };
 
-
+    //打开删除阶段弹窗
-//打开删除阶段弹窗
+    const showDeleteStage = (id) => {
-const showDeleteStage=(id)=>{
+      state.deleteStageId = id;
-
+      state.deleteStageModal = true;
-state.deleteStageId=id
+    };
- state.deleteStageModal=true
+    //关闭删除阶段弹窗
-}
+    const closeDeleteStage = () => {
-//关闭删除阶段弹窗
+      state.deleteStageId = null;
-const closeDeleteStage=()=>{
+      state.deleteStageModal = false;
-  state.deleteStageId=null
+    };
-  state.deleteStageModal=false
+    //删除阶段
-}
- //删除阶段
     const deleteStage = () => {
       console.log("chapterId", state.deleteStageId);
       let obj = {
@@ -1782,8 +1776,8 @@ const closeDeleteStage=()=>{
         .deleteStage(obj)
         .then((res) => {
           console.log("删除阶段成功", res);
-          message.success('删除阶段成功')
+          message.success("删除阶段成功");
-          closeDeleteStage()
+          closeDeleteStage();
           getTask();
         })
         .catch((err) => {
@@ -2032,9 +2026,9 @@ const closeDeleteStage=()=>{
     };
 
     //显示切换模式抽屉
-    const showModeVisible=()=>{
+    const showModeVisible = () => {
-state.unlockModeVisible=true
+      state.unlockModeVisible = true;
-    }
+    };
     return {
       ...toRefs(state),
       selectProjectName,

src/views/system/SystemManage.vue

@@ -77,12 +77,12 @@
         </div>
       </template>
     </draggable>
-    <div id="qrcode" style="display:flex;flex-direction: column;">
+    <div id="qrcode" style="display: flex; flex-direction: column">
       <div>下载二维码</div>
       <qrcode-vue
         :value="qrcodeUrl"
         :size="qrcodeSize"
-        style="width: 200px;height: 200px"
+        style="width: 200px; height: 200px"
       ></qrcode-vue>
     </div>
     <div @click="downloadQr(200)">下载200</div>
@@ -90,11 +90,30 @@
     <div @click="downloadQr(800)">下载800</div>
   </div>
 
-<div @click="changeCodevisible">显示二维码弹窗</div>
+  <div @click="changeCodevisible">显示二维码弹窗</div>
-  <two-dimensional-code v-model:codevisible="codevisible" :codeInfo="codeInfo" index="0" type="课程二维码"/>
+  <two-dimensional-code
+    v-model:codevisible="codevisible"
+    :codeInfo="codeInfo"
+    index="0"
+    type="课程二维码"
+  />
 
   <div @click="changeCodevisible2">显示二维码弹窗22</div>
-  <two-dimensional-code v-model:codevisible="codevisible2" :codeInfo="codeInfo2" index="1" type="签到二维码"/>
+  <two-dimensional-code
+    v-model:codevisible="codevisible2"
+    :codeInfo="codeInfo2"
+    index="1"
+    type="签到二维码"
+  />
+
+  <a-table
+    :columns="columns"
+    :data-source="data"
+    :row-selection="{
+      selectedRowKeys: selectedRowKeys,
+      onChange: onSelectChange,
+    }"
+  />
 </template>
 <script>
 import { reactive, toRefs } from "vue";
@@ -112,7 +131,7 @@ import draggable from "vuedraggable";
 import QrcodeVue from "qrcode.vue";
 import html2canvas from "html2canvas";
 
-import TwoDimensionalCode from '../../components/TwoDimensionalCode.vue'
+import TwoDimensionalCode from "../../components/TwoDimensionalCode.vue";
 export default {
   name: "SystemManage",
   components: {
@@ -121,8 +140,9 @@ export default {
     // PlusOutlined,
     draggable,
     QrcodeVue,
-    TwoDimensionalCode
+    TwoDimensionalCode,
   },
+
   setup() {
     const state = reactive({
       visible: false,
@@ -157,14 +177,79 @@ export default {
           name: "拖拽六",
         },
       ],
-      
-      qrcodeUrl: "https://www.baidu.com/",
-      qrcodeSize:800,
 
-      codevisible:false,
+      qrcodeUrl: "https://www.baidu.com/",
-      codeInfo:{},
+      qrcodeSize: 800,
-      codevisible2:false,
+
-      codeInfo2:{}
+      codevisible: false,
+      codeInfo: {},
+      codevisible2: false,
+      codeInfo2: {},
+
+      columns: [
+        {
+          title: "Name",
+          dataIndex: "name",
+          key: "name",
+        },
+        {
+          title: "Age",
+          dataIndex: "age",
+          key: "age",
+          width: "12%",
+        },
+        {
+          title: "Address",
+          dataIndex: "address",
+          width: "30%",
+          key: "address",
+        },
+      ],
+      data: [
+        {
+          key: 1,
+          name: "John Brown sr.",
+          age: 60,
+          address: "New York No. 1 Lake Park",
+        },
+        {
+          key: 2,
+          name: "Joe Black",
+          age: 32,
+          address: "Sidney No. 1 Lake Park",
+        },
+        {
+          key: 3,
+          name: "Joe Black",
+          age: 32,
+          address: "Sidney No. 1 Lake Park",
+        },
+        {
+          key: 4,
+          name: "Joe Black",
+          age: 32,
+          address: "Sidney No. 1 Lake Park",
+        },
+        {
+          key: 5,
+          name: "Joe Black",
+          age: 32,
+          address: "Sidney No. 1 Lake Park",
+        },
+        {
+          key: 6,
+          name: "Joe Black",
+          age: 32,
+          address: "Sidney No. 1 Lake Park",
+        },
+        {
+          key: 7,
+          name: "Joe Black",
+          age: 32,
+          address: "Sidney No. 1 Lake Park",
+        },
+      ],
+      selectedRowKeys: [],
     });
 
     const showDrawer = () => {
@@ -248,94 +333,101 @@ export default {
     //下载二维码图片
     const downloadQr = (num) => {
       console.log("num", num);
-      state.qrcodeSize=num
+      state.qrcodeSize = num;
- let filename = `${new Date().getTime()}.png`;
+      let filename = `${new Date().getTime()}.png`;
- let canvas=document.getElementsByTagName('canvas')[0]
+      let canvas = document.getElementsByTagName("canvas")[0];
-        let imageUrl = canvas.toDataURL("image/png")
+      let imageUrl = canvas.toDataURL("image/png");
 
-let canvasBox = document.createElement('canvas');
+      let canvasBox = document.createElement("canvas");
-	let	ctx = canvasBox.getContext("2d");
+      let ctx = canvasBox.getContext("2d");
-		var img = new Image();
+      var img = new Image();
-		// 需要添加文字的图片
+      // 需要添加文字的图片
-		img.src = imageUrl;
+      img.src = imageUrl;
-		// 等待图片加载完成
+      // 等待图片加载完成
-		img.onload = function(){
+      img.onload = function () {
-			// 将图片添加到canvas
+        // 将图片添加到canvas
-		    ctx.drawImage(img, 0, 0, 1240, 2208)
+        ctx.drawImage(img, 0, 0, 1240, 2208);
-			// 设置字体
+        // 设置字体
-			ctx.font = "73px 微软雅黑 bolder"
+        ctx.font = "73px 微软雅黑 bolder";
-			// 设置字体颜色
+        // 设置字体颜色
-			ctx.fillStyle = "#955f17"
+        ctx.fillStyle = "#955f17";
-			ctx.textAlign = "center"
+        ctx.textAlign = "center";
-			// 添加文字和位置
+        // 添加文字和位置
-			ctx.fillText("微信名", 621, 1050);
+        ctx.fillText("微信名", 621, 1050);
-    
+
-			// 导出为图片
+        // 导出为图片
-			let url = canvasBox.toDataURL("image/png")
+        let url = canvasBox.toDataURL("image/png");
-      let a = document.createElement("a");
+        let a = document.createElement("a");
-			 a.style.display = "none";
+        a.style.display = "none";
         a.download = filename;
         a.href = url;
         document.body.appendChild(a);
         a.click();
-    }
+      };
-
-
-        // let a = document.createElement("a");
-        // a.style.display = "none";
-        // a.download = filename;
-        // a.href = imageUrl;
-        // document.body.appendChild(a);
-        // a.click();
 
+      // let a = document.createElement("a");
+      // a.style.display = "none";
+      // a.download = filename;
+      // a.href = imageUrl;
+      // document.body.appendChild(a);
+      // a.click();
 
       html2canvas(document.querySelector("#qrcode"), {
         useCORS: true, //支持图片跨域
       }).then((canvas) => {
-// var extra_canvas = document.createElement("canvas");
+        // var extra_canvas = document.createElement("canvas");
-//                 extra_canvas.setAttribute('width',num);
+        //                 extra_canvas.setAttribute('width',num);
-//                 extra_canvas.setAttribute('height',num);
+        //                 extra_canvas.setAttribute('height',num);
-//                 var ctx = extra_canvas.getContext('2d');
+        //                 var ctx = extra_canvas.getContext('2d');
-//                 ctx.drawImage(canvas,0,0,num,num);
+        //                 ctx.drawImage(canvas,0,0,num,num);
-//                 let filename = `${new Date().getTime()}.png`;
+        //                 let filename = `${new Date().getTime()}.png`;
-//                 var imageUrl = extra_canvas.toDataURL("image/png",1.0);
+        //                 var imageUrl = extra_canvas.toDataURL("image/png",1.0);
 
-        console.log('canvas',canvas, canvas.width,canvas.style.width)
+        console.log("canvas", canvas, canvas.width, canvas.style.width);
-      
+
-      // //   let ctx = canvas.getContext('2d');
+        // //   let ctx = canvas.getContext('2d');
-      // //           ctx.drawImage(canvas,0,0,canvas.width, canvas.height);
+        // //           ctx.drawImage(canvas,0,0,canvas.width, canvas.height);
-      // //            canvas.width=num
+        // //            canvas.width=num
-      // //  canvas.height=num
+        // //  canvas.height=num
-      // //  canvas.style.width=num+'px'
+        // //  canvas.style.width=num+'px'
-      // // canvas.style.height=num+'px'
+        // // canvas.style.height=num+'px'
-      //   let filename = `${new Date().getTime()}.png`;
+        //   let filename = `${new Date().getTime()}.png`;
-      //   let imageUrl = canvas.toDataURL("image/png");
+        //   let imageUrl = canvas.toDataURL("image/png");
-      //   let a = document.createElement("a");
+        //   let a = document.createElement("a");
-      //   a.style.display = "none";
+        //   a.style.display = "none";
-      //   a.download = filename;
+        //   a.download = filename;
-      //   a.href = imageUrl;
+        //   a.href = imageUrl;
-      //   document.body.appendChild(a);
+        //   document.body.appendChild(a);
-      //   a.click();
+        //   a.click();
       });
     };
 
     //显示二维码弹窗
-    const changeCodevisible=()=>{
+    const changeCodevisible = () => {
-      state.codevisible=true
+      state.codevisible = true;
-      state.codeInfo={
+      state.codeInfo = {
-        title:"签到二维码",
+        title: "签到二维码",
-        name:'管理者进阶面授课程',
+        name: "管理者进阶面授课程",
-        url:"https://www.baidu.com/",
+        url: "https://www.baidu.com/",
+      };
+    };
+    const changeCodevisible2 = () => {
+      state.codevisible2 = true;
+      state.codeInfo2 = {
+        title: "签到二维码2222",
+        name: "管理者进阶面授课程2222",
+        url: "https://blog.csdn.net/qq_44034384/article/details/93612152",
+      };
+    };
+
+    const onSelectChange = (selectedRowKeys) => {
+      console.log("selectedRowKeys changed: ", selectedRowKeys);
+
+      if (selectedRowKeys.length > 2) {
+        return;
       }
-    }
+      state.selectedRowKeys = selectedRowKeys;
-    const changeCodevisible2=()=>{
+    };
-      state.codevisible2=true
-      state.codeInfo2={
-        title:"签到二维码2222",
-        name:'管理者进阶面授课程2222',
-        url:"https://blog.csdn.net/qq_44034384/article/details/93612152",
-      }
-    }
     return {
       ...toRefs(state),
       showDrawer,
@@ -346,6 +438,8 @@ let canvasBox = document.createElement('canvas');
       downloadQr,
       changeCodevisible,
       changeCodevisible2,
+
+      onSelectChange,
     };
   },
 };
@@ -353,7 +447,7 @@ let canvasBox = document.createElement('canvas');
 <style lang="scss">
 .systemManage {
   width: 100%;
-  
+
   .ant-input-textarea-show-count {
     position: relative;
   }