sunlupeng 1 year ago
parent
commit
1d37fb883a
4 changed files with 195 additions and 3 deletions
  1. 12 0
      src/api/answerGame.js
  2. 5 3
      src/permission.js
  3. 13 0
      src/router/index.js
  4. 165 0
      src/views/answerGame/answerList.vue

+ 12 - 0
src/api/answerGame.js

@@ -0,0 +1,12 @@
+import request from '@/utils/request'
+
+export function answerList(query) {
+  return request({
+    url: '/answer/list',
+    method: 'get',
+    params:query
+  })
+}
+
+
+

+ 5 - 3
src/permission.js

@@ -39,7 +39,9 @@ const myRoles = [
   'pointsDetailList',
   'activityManage', 
   'activityList', 
-  'noticeManage', 
+  'activityManage', 
+  'answerGame', 
+  'answerList', 
   'noticeList', 
   'ranking',
   'rankingList',
@@ -80,8 +82,8 @@ router.beforeEach((to, from, next) => {
       if (store.getters.roles.length === 0) { // 判断当前用户是否已拉取完user_info信息
         store.dispatch('GetUserInfo').then(res => {
           store.dispatch('GetUserMenus').then(res => { // 拉取user_info
-            const roles = res.data.data // note: roles must be a array! such as: ['editor','develop']
-            // const roles = myRoles;
+            // const roles = res.data.data // note: roles must be a array! such as: ['editor','develop']
+            const roles = myRoles;
             store.dispatch('GenerateRoutes', { roles }).then(() => { // 根据roles权限生成可访问的路由表
               router.addRoutes(store.getters.addRouters) // 动态添加可访问路由表
               next({ ...to, replace: true }) // hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record

+ 13 - 0
src/router/index.js

@@ -141,6 +141,19 @@ export const asyncRouterMap = [
       // { path: 'activityList', component: _import('activityManage/activityList'), name: 'activityList', meta: { title: '活动列表', noCache: false, hideTag: true, hidden: true}},
     ]
   },
+  {
+    path: '/answerGame',
+    component: Layout,
+    redirect: 'noredirect',
+    name: 'answerGame',
+    meta: {
+      title: '答题管理',
+      icon: 'huodong'
+    },
+    children: [
+      { path: 'answerList', component: _import('answerGame/answerList'), name: 'answerList', meta: { title: '答题列表', icon: 'huodong', noCache: true }},
+    ]
+  },
   {
     path: '/noticeManage',
     component: Layout,

+ 165 - 0
src/views/answerGame/answerList.vue

@@ -0,0 +1,165 @@
+<template>
+    <div class="app-container calendar-list-container">
+
+        <!-- 查询和其他操作 -->
+        <div class="filter-container">
+            <el-input clearable class="filter-item" style="width: 200px;" placeholder="活动名称"
+                v-model="listQuery.userName"></el-input>
+            <el-date-picker
+            class="filter-item"
+            value-format="yyyy-MM-dd"
+            v-model="listQuery.createTime"
+            type="date"
+            placeholder="创建日期">
+            </el-date-picker>
+            <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+
+        </div>
+
+        <!-- 查询结果 -->
+        <el-table size="small" :data="list" v-loading="listLoading" element-loading-text="正在查询中。。。" border fit
+            highlight-current-row>
+            <el-table-column type="index" label="序号" header-align="center" align="center">
+            </el-table-column>
+            <el-table-column align="center" min-width="180px" label="部门" prop="deptName">
+            </el-table-column>
+            <el-table-column align="center" min-width="80px" label="员工" prop="userName">
+            </el-table-column>
+            <el-table-column align="center" min-width="80px" label="正确数" prop="rightQuantities">
+            </el-table-column>
+            <el-table-column align="center" min-width="80px" label="用时(秒)" prop="answerTime">
+            </el-table-column>
+            
+            <el-table-column align="center" min-width="150px" label="答题时间" prop="answerDate">
+            </el-table-column>
+            <el-table-column align="center" min-width="150px" label="日期" prop="createTime">
+            </el-table-column>
+            <el-table-column align="center" min-width="80px" label="答题记录">
+                <template slot-scope="scope">
+                    <el-button type="primary" size="small" @click="handleView(scope.row.answerLogs)">查看</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+
+        <!-- 分页 -->
+        <div class="pagination-container">
+            <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
+                :current-page="listQuery.page" :page-sizes="[10, 20, 30, 50]" :page-size="listQuery.limit"
+                layout="total, sizes, prev, pager, next, jumper" :total="total">
+            </el-pagination>
+        </div>
+        <!-- 答题记录列表 -->
+        <el-dialog :close-on-click-modal="false" title="答题记录" :visible.sync="dialogFormVisible" width="70%">
+            <!-- 查询结果 -->
+            <el-table size="small" :data="itemList" element-loading-text="正在查询中。。。" border fit
+                highlight-current-row>
+                <el-table-column align="center" min-width="150px" label="题目" prop="ask">
+                </el-table-column>
+                <el-table-column align="center" min-width="100px" label="员工答案" prop="userAnswer">
+                </el-table-column>
+                <el-table-column align="center" min-width="200px" label="正确答案" prop="answer">
+                </el-table-column>
+            </el-table>
+        </el-dialog>
+    </div>
+</template>
+  
+<style>
+.demo-table-expand {
+    font-size: 0;
+}
+
+.demo-table-expand label {
+    width: 200px;
+    color: #99a9bf;
+}
+
+.demo-table-expand .el-form-item {
+    margin-right: 0;
+    margin-bottom: 0;
+}
+</style>
+  
+<script>
+import { answerList } from "@/api/answerGame";
+import waves from "@/directive/waves"; // 水波纹指令
+
+export default {
+    directives: { waves },
+    data() {
+        return {
+            list: [],
+            itemList:[],
+            total: 0,
+            listLoading: false,
+            listQuery: {
+                page: 1,
+                limit: 10,
+                userName: '',
+                createTime: '',
+            },
+            dialogFormVisible: false,
+        }
+    },
+    created() {
+        this.getList();
+    },
+    methods: {
+        handleView(row) {
+            this.itemList = row;
+            this.dialogFormVisible = true
+        },
+        getList() {
+            this.listLoading = true
+            answerList(this.listQuery).then(response => {
+                this.list = response.data.data.items
+                this.total = response.data.data.total
+                this.listLoading = false
+            }).catch(() => {})
+        },
+       
+
+        handleFilter() {
+            this.listQuery.page = 1
+            this.getList()
+        },
+        handleSizeChange(val) {
+            this.listQuery.limit = val
+            this.getList()
+        },
+        handleCurrentChange(val) {
+            this.listQuery.page = val
+            this.getList()
+        },
+
+        
+    }
+}
+</script>
+<style>
+.ad-avatar-uploader .el-upload {
+    border: 1px dashed #d9d9d9;
+    border-radius: 6px;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+}
+
+.ad-avatar-uploader .el-upload:hover {
+    border-color: #409EFF;
+}
+
+.ad-avatar-uploader-icon {
+    font-size: 28px;
+    color: #8c939d;
+    width: 178px;
+    height: 178px;
+    line-height: 178px;
+    text-align: center;
+}
+
+.ad-avatar {
+    display: block;
+}
+</style>
+