From d1bfbe0aad96f2305e63dd64034a24cf1f0490f1 Mon Sep 17 00:00:00 2001
From: dong <58670809@qq.com>
Date: Wed, 23 Nov 2022 18:08:17 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BB=A3=E7=A0=81=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../competitionManage/bankList/index.vue      |   2 +-
 src/views/organization/classManage/index.vue  |   2 +-
 src/views/organization/examManage/index.vue   | 486 +++++++++---------
 src/views/organization/index.vue              | 110 ++--
 src/views/organization/ruleManage/index.vue   |   2 +-
 .../organization/trainingManage/index.vue     |   1 -
 6 files changed, 312 insertions(+), 291 deletions(-)

diff --git a/src/views/competitionManage/bankList/index.vue b/src/views/competitionManage/bankList/index.vue
index 68f620b79..0f716e11d 100644
--- a/src/views/competitionManage/bankList/index.vue
+++ b/src/views/competitionManage/bankList/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <query-list-page ref="user" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
+    <query-list-page ref="user" :card-padding="10" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
     <dialog-detail ref="detail" />
     <preview-answer ref="previewAnswer" :question-id="questionId" />
   </div>
diff --git a/src/views/organization/classManage/index.vue b/src/views/organization/classManage/index.vue
index 37755d9f5..1d5485715 100644
--- a/src/views/organization/classManage/index.vue
+++ b/src/views/organization/classManage/index.vue
@@ -2,10 +2,10 @@
   <div style="width: 100%;height: 100%;">
     <QueryListPage
       ref="classQueryListPage"
+      :card-padding="10"
       :query-form="classQueryForm"
       :pager-config="pagerConfig"
       :query-list="classQueryList"
-      style="width:96%;margin: 0 auto;"
     />
     <create-class ref="createClass" @refresh="classRefresh" />
   </div>
diff --git a/src/views/organization/examManage/index.vue b/src/views/organization/examManage/index.vue
index fa36b4c6f..1812f8920 100644
--- a/src/views/organization/examManage/index.vue
+++ b/src/views/organization/examManage/index.vue
@@ -1,253 +1,253 @@
 <template>
-	<div style="width: 100%;height: 100%;">
-		<QueryListPage
-			ref="examQueryListPage"
-			:query-form="examQueryForm"
-			:pager-config="pagerConfig"
-			:query-list="examQueryList"
-			style="width:96%;margin: 0 auto;"
-		/>
-	</div>
+  <div style="width: 100%;">
+    <QueryListPage
+      ref="examQueryListPage"
+      :card-padding="10"
+      :query-form="examQueryForm"
+      :pager-config="pagerConfig"
+      :query-list="examQueryList"
+    />
+  </div>
 </template>
 
 <script>
-import config from '@/scripts/ConstConfig'
-import { getPapaerListOfOrg, lockPaper, unlockPaper, deletePaper } from '@/api/management/exam'
-import { getPublishMapListOnline } from '@/api/jmap/map'
+import config from '@/scripts/ConstConfig';
+import { getPapaerListOfOrg, lockPaper, unlockPaper, deletePaper } from '@/api/management/exam';
+import { getPublishMapListOnline } from '@/api/jmap/map';
 
-const { paperStateArr, paperStateQueryArr } = config.ConstSelect
+const { paperStateArr, paperStateQueryArr } = config.ConstSelect;
 
 export default {
-	name: 'ExamManage',
-	data() {
-		return {
-			pagerConfig: {
-				pageSize: 'pageSize',
-				pageIndex: 'pageNum',
-			},
-			mapIdList: [],
-			examQueryForm: {
-				leftSpan: 14,
-				textAlign: 'right',
-				labelWidth: '90px',
-				reset: true,
-				columnNum: 3,
-				queryObject: {
-					name: {
-						type: 'text',
-						label: '试卷名称:',
-					},
-					findState: {
-						type: 'select',
-						label: '状态:',
-						value: 1,
-						config: {
-							data: paperStateQueryArr.map((v, i) => ({ value: i + 1, label: v })),
-						},
-						noClearable: true,
-					},
-				},
-			},
-			examQueryList: {
-				query: obj => getPapaerListOfOrg({ ...obj, orgId: this.orgId }),
-				selectCheckShow: false,
-				indexShow: false,
-				columns: [
-					{
-						title: '试卷名称',
-						prop: 'name',
-					},
-					{
-						title: '简介',
-						prop: 'profile',
-					},
-					{
-						title: '状态',
-						prop: 'state',
-						type: 'tag',
-						width: '80',
-						columnValue: row => {
-							return paperStateArr[row.state - 1]
-						},
-						tagType: row => '',
-					},
-					{
-						title: '开始时间',
-						prop: 'startTime',
-					},
-					{
-						title: '截止时间',
-						prop: 'endTime',
-					},
-					{
-						title: '满分',
-						prop: 'fullScore',
-						width: '80',
-					},
-					{
-						title: '及格分',
-						prop: 'passScore',
-						width: '80',
-					},
-					{
-						title: '时长',
-						prop: 'validDuration',
-						type: 'tag',
-						width: '80',
-						columnValue: row => row.validDuration,
-						tagType: row => {},
-					},
-					{
-						title: '创建人',
-						prop: 'creatorName',
-						width: '150',
-						formatter: row => row.creatorInfo.name,
-					},
-					{
-						type: 'button',
-						title: this.$t('global.operate'),
-						width: '350',
-						buttons: [
-							{
-								name: '成绩查询',
-								handleClick: this.handleQueryGrade,
-								type: 'primary',
-							},
-							{
-								name: '成绩统计',
-								handleClick: this.handleGradeStatistics,
-								type: 'success',
-							},
-							{
-								name: '编辑',
-								handleClick: this.handleEdit,
-								type: 'primary',
-								showControl: row => {
-									return row.creatorId == this.userId && row.state === 1
-								},
-							},
-							{
-								name: '封存',
-								handleClick: this.handleLock,
-								type: 'warning',
-								showControl: row => {
-									return row.creatorId == this.userId && row.state === 1
-								},
-							},
-							{
-								name: '解封',
-								handleClick: this.handleUnlock,
-								type: 'danger',
-								showControl: row => {
-									return row.creatorId == this.userId && row.state === 2
-								},
-							},
-							{
-								name: '删除',
-								handleClick: this.handleDelete,
-								type: 'danger',
-								showControl: row => {
-									return row.creatorId == this.userId && row.state === 1
-								},
-							},
-						],
-					},
-				],
-				actions: [{ text: '新建试卷', handler: this.examCreate }],
-			},
-		}
-	},
-	computed: {
-		userId() {
-			return this.$store.state.user.id
-		},
-		orgId() {
-			return this.$store.state.user.companyId
-		},
-	},
-	created() {
-		this.mapIdList = []
-		getPublishMapListOnline().then(response => {
-			this.mapIdList = response.data
-		})
-	},
-	methods: {
-		handleQueryGrade(index, row) {
-			this.$router.push({ path: '/info/gradeList', query: { examId: row.id, name: row.name } })
-		},
-		handleGradeStatistics(index, row) {
-			this.$router.push({ path: '/info/gradeStatistics', query: { examId: row.id, name: row.name } })
-		},
-		handleEdit(index, row) {
-			this.$router.push({ path: `/info/examRule/draft/edit/${row.id}`, query: { source: 'org' } })
-		},
-		examCreate() {
-			this.$router.push({ path: `/info/examRule/draft/add/0`, query: { source: 'org' } })
-		},
-		handleLock(index, data) {
-			lockPaper(data.id)
-				.then(res => {
-					this.examRefresh()
-					this.$message.success('封存试卷成功！')
-				})
-				.catch(error => {
-					this.$message.error('封存试卷失败：' + error.message)
-				})
-		},
-		handleUnlock(index, data) {
-			this.$confirm('该操作将解封试卷，是否继续？', this.$t('global.tips'), {
-				confirmButtonText: this.$t('global.confirm'),
-				cancelButtonText: this.$t('global.cancel'),
-				type: 'warning',
-			})
-				.then(() => {
-					unlockPaper(data.id)
-						.then(res => {
-							this.examRefresh()
-							this.$message({
-								type: 'success',
-								message: '解封试卷成功！',
-							})
-						})
-						.catch(res => {
-							if (res.code == '10004') {
-								this.$message({ type: 'error', message: '解封失败:试卷已被使用，无法解封!' })
-							} else if (res.code == '10003') {
-								this.$message({ type: 'warning', message: '解封失败:无权限解封!' })
-							} else {
-								this.$message({ type: 'error', message: '解封试卷失败！' })
-							}
-						})
-				})
-				.catch(() => {})
-		},
-		handleDelete(index, data) {
-			this.$confirm('确定删除该试卷吗?', this.$t('global.tips'), {
-				confirmButtonText: this.$t('global.confirm'),
-				cancelButtonText: this.$t('global.cancel'),
-				type: 'warning',
-			})
-				.then(() => deletePaper(data.id))
-				.then(resp => {
-					this.examRefresh()
-					this.$message({
-						type: 'success',
-						message: '删除成功！',
-					})
-				})
-				.catch(res => {
-					if (res.code && res.code !== 200) {
-						this.$message({ type: 'error', message: res.message })
-					}
-				})
-		},
-		examRefresh() {
-			this.$nextTick(() => {
-				this.$refs.examQueryListPage.refresh(true)
-			})
-		},
-	},
-}
+    name: 'ExamManage',
+    data() {
+        return {
+            pagerConfig: {
+                pageSize: 'pageSize',
+                pageIndex: 'pageNum'
+            },
+            mapIdList: [],
+            examQueryForm: {
+                leftSpan: 14,
+                textAlign: 'right',
+                labelWidth: '90px',
+                reset: true,
+                columnNum: 3,
+                queryObject: {
+                    name: {
+                        type: 'text',
+                        label: '试卷名称:'
+                    },
+                    findState: {
+                        type: 'select',
+                        label: '状态:',
+                        value: 1,
+                        config: {
+                            data: paperStateQueryArr.map((v, i) => ({ value: i + 1, label: v }))
+                        },
+                        noClearable: true
+                    }
+                }
+            },
+            examQueryList: {
+                query: obj => getPapaerListOfOrg({ ...obj, orgId: this.orgId }),
+                selectCheckShow: false,
+                indexShow: false,
+                columns: [
+                    {
+                        title: '试卷名称',
+                        prop: 'name'
+                    },
+                    {
+                        title: '简介',
+                        prop: 'profile'
+                    },
+                    {
+                        title: '状态',
+                        prop: 'state',
+                        type: 'tag',
+                        width: '80',
+                        columnValue: row => {
+                            return paperStateArr[row.state - 1];
+                        },
+                        tagType: row => ''
+                    },
+                    {
+                        title: '开始时间',
+                        prop: 'startTime'
+                    },
+                    {
+                        title: '截止时间',
+                        prop: 'endTime'
+                    },
+                    {
+                        title: '满分',
+                        prop: 'fullScore',
+                        width: '80'
+                    },
+                    {
+                        title: '及格分',
+                        prop: 'passScore',
+                        width: '80'
+                    },
+                    {
+                        title: '时长',
+                        prop: 'validDuration',
+                        type: 'tag',
+                        width: '80',
+                        columnValue: row => row.validDuration,
+                        tagType: row => {}
+                    },
+                    {
+                        title: '创建人',
+                        prop: 'creatorName',
+                        width: '150',
+                        formatter: row => row.creatorInfo.name
+                    },
+                    {
+                        type: 'button',
+                        title: this.$t('global.operate'),
+                        width: '350',
+                        buttons: [
+                            {
+                                name: '成绩查询',
+                                handleClick: this.handleQueryGrade,
+                                type: 'primary'
+                            },
+                            {
+                                name: '成绩统计',
+                                handleClick: this.handleGradeStatistics,
+                                type: 'success'
+                            },
+                            {
+                                name: '编辑',
+                                handleClick: this.handleEdit,
+                                type: 'primary',
+                                showControl: row => {
+                                    return row.creatorId == this.userId && row.state === 1;
+                                }
+                            },
+                            {
+                                name: '封存',
+                                handleClick: this.handleLock,
+                                type: 'warning',
+                                showControl: row => {
+                                    return row.creatorId == this.userId && row.state === 1;
+                                }
+                            },
+                            {
+                                name: '解封',
+                                handleClick: this.handleUnlock,
+                                type: 'danger',
+                                showControl: row => {
+                                    return row.creatorId == this.userId && row.state === 2;
+                                }
+                            },
+                            {
+                                name: '删除',
+                                handleClick: this.handleDelete,
+                                type: 'danger',
+                                showControl: row => {
+                                    return row.creatorId == this.userId && row.state === 1;
+                                }
+                            }
+                        ]
+                    }
+                ],
+                actions: [{ text: '新建试卷', handler: this.examCreate }]
+            }
+        };
+    },
+    computed: {
+        userId() {
+            return this.$store.state.user.id;
+        },
+        orgId() {
+            return this.$store.state.user.companyId;
+        }
+    },
+    created() {
+        this.mapIdList = [];
+        getPublishMapListOnline().then(response => {
+            this.mapIdList = response.data;
+        });
+    },
+    methods: {
+        handleQueryGrade(index, row) {
+            this.$router.push({ path: '/info/gradeList', query: { examId: row.id, name: row.name } });
+        },
+        handleGradeStatistics(index, row) {
+            this.$router.push({ path: '/info/gradeStatistics', query: { examId: row.id, name: row.name } });
+        },
+        handleEdit(index, row) {
+            this.$router.push({ path: `/info/examRule/draft/edit/${row.id}`, query: { source: 'org' } });
+        },
+        examCreate() {
+            this.$router.push({ path: `/info/examRule/draft/add/0`, query: { source: 'org' } });
+        },
+        handleLock(index, data) {
+            lockPaper(data.id)
+                .then(res => {
+                    this.examRefresh();
+                    this.$message.success('封存试卷成功！');
+                })
+                .catch(error => {
+                    this.$message.error('封存试卷失败：' + error.message);
+                });
+        },
+        handleUnlock(index, data) {
+            this.$confirm('该操作将解封试卷，是否继续？', this.$t('global.tips'), {
+                confirmButtonText: this.$t('global.confirm'),
+                cancelButtonText: this.$t('global.cancel'),
+                type: 'warning'
+            })
+                .then(() => {
+                    unlockPaper(data.id)
+                        .then(res => {
+                            this.examRefresh();
+                            this.$message({
+                                type: 'success',
+                                message: '解封试卷成功！'
+                            });
+                        })
+                        .catch(res => {
+                            if (res.code == '10004') {
+                                this.$message({ type: 'error', message: '解封失败:试卷已被使用，无法解封!' });
+                            } else if (res.code == '10003') {
+                                this.$message({ type: 'warning', message: '解封失败:无权限解封!' });
+                            } else {
+                                this.$message({ type: 'error', message: '解封试卷失败！' });
+                            }
+                        });
+                })
+                .catch(() => {});
+        },
+        handleDelete(index, data) {
+            this.$confirm('确定删除该试卷吗?', this.$t('global.tips'), {
+                confirmButtonText: this.$t('global.confirm'),
+                cancelButtonText: this.$t('global.cancel'),
+                type: 'warning'
+            })
+                .then(() => deletePaper(data.id))
+                .then(resp => {
+                    this.examRefresh();
+                    this.$message({
+                        type: 'success',
+                        message: '删除成功！'
+                    });
+                })
+                .catch(res => {
+                    if (res.code && res.code !== 200) {
+                        this.$message({ type: 'error', message: res.message });
+                    }
+                });
+        },
+        examRefresh() {
+            this.$nextTick(() => {
+                this.$refs.examQueryListPage.refresh(true);
+            });
+        }
+    }
+};
 </script>
 
 <style scoped></style>
diff --git a/src/views/organization/index.vue b/src/views/organization/index.vue
index 1963342e1..a06468b69 100644
--- a/src/views/organization/index.vue
+++ b/src/views/organization/index.vue
@@ -1,28 +1,25 @@
 <template>
-  <div>
-    <div class="title_content">{{ companyName + '教学管理' }}</div>
-    <div class="lessonManageInfo">
-      <el-menu class="lessonManageMenu" default-active="2-1">
-        <el-menu-item index="1" @click="clickMenu">
-          <img :src="classIcon" class="teachMenu">
-          <span class="teachMenuTitle" :style="{color: $route.path.includes('classManage')?'#5BDBFF': '#000'}">班级管理</span>
-        </el-menu-item>
-        <el-menu-item index="7" @click="clickMenu">
-          <img :src="ruleIcon" class="teachMenu">
-          <span class="teachMenuTitle" :style="{color: $route.path.includes('trainingManage')?'#5BDBFF': '#000'}">实训管理</span>
-        </el-menu-item>
-        <el-menu-item index="8" @click="clickMenu">
-          <img :src="lessonIcon" class="teachMenu">
-          <span class="teachMenuTitle" :style="{color: $route.path.includes('theoryManage')?'#5BDBFF': '#000'}">理论题目管理</span>
-        </el-menu-item>
-        <el-menu-item index="3" @click="clickMenu">
-          <img :src="examIcon" class="teachMenu">
-          <span slot="title" class="teachMenuTitle" :style="{color: $route.path.includes('examManage')?'#5BDBFF': '#000'}">考试管理</span>
-        </el-menu-item>
+  <div class="mianBox">
+    <div class="lessonManageInfo" :style="{width: widthLeft+'px'}">
+      <el-menu
+        :default-active="defaultIndex"
+        class="el-menu-vertical-demo lessonManageMenu"
+        background-color="#545c64"
+        text-color="#fff"
+        router
+        active-text-color="#ffd04b"
+      >
+        <template>
+          <el-menu-item v-for="(item, i) in menuList" :key="i" :index="item.path">
+            <img :src="item.imgUrl" class="teachMenu">
+            <span>{{ item.name }}</span>
+          </el-menu-item>
+        </template>
       </el-menu>
-      <div class="lessonManageOther">
-        <router-view />
-      </div>
+      <drap-left :width-left="widthLeft" @drapWidth="drapWidth" />
+    </div>
+    <div class="lessonManageOther" :style="{width: rightWidth, height: rightHeight}">
+      <router-view />
     </div>
   </div>
 </template>
@@ -32,9 +29,13 @@ import ClassIcon from '@/assets/teachManage/class.png';
 import LessonIcon from '@/assets/teachManage/lesson.png';
 import ExamIcon from '@/assets/teachManage/exam.png';
 import RuleIcon from '@/assets/teachManage/rule.png';
+import drapLeft from '@/views/components/drapLeft/index';
 
 export default {
     name: 'Organization',
+    components: {
+        drapLeft
+    },
     data() {
         return {
             classIcon: ClassIcon,
@@ -44,41 +45,62 @@ export default {
 
             mapIdList: [],
             lessonList: [],
-            classList: []
-
+            classList: [],
+            widthLeft: 200,
+            defaultIndex: '/teaching/organization/classManage',
+            menuList: [
+                {name: '班级管理', path: '/teaching/organization/classManage', imgUrl: ClassIcon},
+                {name: '实训管理', path: '/teaching/organization/trainingManage', imgUrl: RuleIcon},
+                {name: '理论题目管理', path: '/teaching/organization/theoryManage', imgUrl: LessonIcon},
+                {name: '考试管理', path: '/teaching/organization/examManage', imgUrl: ExamIcon}
+            ]
         };
     },
     computed: {
         companyName() {
             return this.$store.state.user.companyName;
+        },
+        rightWidth() {
+            return `calc(100% - ${this.widthLeft}px)`;
+        },
+        rightHeight() {
+            return (this.height - 110) + 'px';
+        },
+        height() {
+            return this.$store.state.app.height;
         }
     },
+    watch: {
+        '$route'(val) {
+            this.defaultIndex = val.path;
+        }
+    },
+    mounted() {
+        this.defaultIndex = this.$route.path;
+    },
     methods:{
-        clickMenu(val) {
-            if (val.index === '1') {
-                this.$router.replace('/teaching/organization/classManage');
-            } else if (val.index === '3') {
-                this.$router.replace('/teaching/organization/examManage');
-            } else if (val.index === '4') {
-                this.$router.replace('/teaching/organization/ruleManage');
-            } else if (val.index === '7') {
-                this.$router.replace('/teaching/organization/trainingManage'); //
-            } else if (val.index === '8') {
-                this.$router.replace('/teaching/organization/theoryManage');
-            }
+        drapWidth(width) {
+            this.widthLeft = Number(width);
         }
     }
 };
 </script>
 
 <style scoped>
-	.back_box {height: 20px;z-index: 36;width: 40px;text-align: center;position: absolute;right: 20px;top: -20px;}
-	.title_content {width: 100%;margin: 20px 0 30px;text-align: center;font-size: 28px;font-weight: bold;}
   .teachMenu{width: 18px;height: 18px;margin-right: 8px;}
   .lessonIcon{font-size: 16px;}
-  .teachMenuTitle{font-size: 18px;}
-  .lessonManageBack{position: fixed;right: 20px;top: 70px;}
-  .lessonManageOther{width: calc(100% - 200px);margin-left: 200px;}
-  .lessonManageInfo{width: 96%;margin: 0 auto;overflow: hidden;}
-  .lessonManageMenu{width: 200px;float: left;}
+  .lessonManageOther{
+	border: 1px solid #DCDFE6;
+	margin: 10px;
+	padding: 10px;
+	overflow: auto;
+  }
+  .lessonManageMenu{
+	height: 100%;
+  }
+  .mianBox {
+	width: 100%;
+	height: 100%;
+	display: flex;
+  }
 </style>
diff --git a/src/views/organization/ruleManage/index.vue b/src/views/organization/ruleManage/index.vue
index 36b48fce4..987d1dcb7 100644
--- a/src/views/organization/ruleManage/index.vue
+++ b/src/views/organization/ruleManage/index.vue
@@ -2,10 +2,10 @@
   <div style="width: 100%;height: 100%">
     <QueryListPage
       ref="ruleQueryListPage"
+      :card-padding="10"
       :query-form="ruleQueryForm"
       :pager-config="pagerConfig"
       :query-list="ruleQueryList"
-      style="width:96%;margin: 0 auto;"
     />
     <apply-class ref="applyClass" @refresh="refresh" />
   </div>
diff --git a/src/views/organization/trainingManage/index.vue b/src/views/organization/trainingManage/index.vue
index 8e1454bd9..8749ff71b 100644
--- a/src/views/organization/trainingManage/index.vue
+++ b/src/views/organization/trainingManage/index.vue
@@ -55,7 +55,6 @@ export default {
                 selectCheckShow: false,
                 paginationHiden: true,
                 indexShow: true,
-                height: 500,
                 columns: [
                     {
                         title: this.$t('trainingManage.name'),