孙向锦 / SunvoteEducation

Commit 74b6a00db44e27261fbf04873e53069928f32044

Authored by jack
2 parents dc65e1cd cefa769a

解决冲突

Inline Side-by-side
Showing 6 changed files with 1077 additions and 0 deletions
.gitignore
  View file @74b6a00
... ... @@ -14,3 +14,4 @@ tests/**/coverage/
14 14 *.ntvs*
15 15 *.njsproj
16 16 *.sln
  17 +
... ...
src/views/classes/blend/detail.vue 0 → 100644
  View file @74b6a00
  1 +<template>
  2 + <div>
  3 + <Dec :content="content" />
  4 + <div class="blendDetail">
  5 + <p class="footer"><el-button type="primary" @click="$router.push('/classes/blend')">返回</el-button></p>
  6 + <div style="height:calc(100% - 40px);overflow:auto;">
  7 + <p>名单名称：0201考室</p>
  8 + <p>选择学制：小学</p>
  9 + <p>选择年级：一年级</p>
  10 + <p>有效期至：2020年03月01日</p>
  11 + <p>可见范围：全校可见</p>
  12 + <p>启动状态：正常</p>
  13 + <p>临时名单：</p>
  14 + <p style="text-align:right;padding-right:10px;">
  15 + <el-button type="primary" size="small">导出名单</el-button>
  16 + </p>
  17 + <el-table
  18 + :data="tableData"
  19 + style="width: 100%"
  20 + >
  21 + <el-table-column
  22 + prop="no"
  23 + label="序号"
  24 + width="180"
  25 + />
  26 + <el-table-column
  27 + prop="name"
  28 + label="姓名"
  29 + width="180"
  30 + />
  31 + <el-table-column
  32 + prop="sex"
  33 + label="性别"
  34 + width="180"
  35 + />
  36 + <el-table-column
  37 + prop="number"
  38 + label="学号"
  39 + width="180"
  40 + />
  41 + <el-table-column
  42 + prop="keybord"
  43 + label="键盘ID"
  44 + />
  45 + </el-table>
  46 + </div>
  47 + </div>
  48 + </div>
  49 +</template>
  50 +<script>
  51 +import Dec from '@/components/Dec'
  52 +export default {
  53 + name: 'Detail',
  54 + components: {
  55 + Dec
  56 + },
  57 + data() {
  58 + return {
  59 + content: '',
  60 + tableData: [{
  61 + no: 1,
  62 + name: '张三',
  63 + sex: '男',
  64 + number: '1001',
  65 + keybord: '20200203'
  66 + }, {
  67 + no: 2,
  68 + name: '张三',
  69 + sex: '男',
  70 + number: '1002',
  71 + keybord: '20200204'
  72 + }, {
  73 + no: 3,
  74 + name: '张三',
  75 + sex: '男',
  76 + number: '1003',
  77 + keybord: '20200205'
  78 + }, {
  79 + no: 4,
  80 + name: '张三',
  81 + sex: '男',
  82 + number: '1004',
  83 + keybord: '20200206'
  84 + },
  85 + {
  86 + no: 4,
  87 + name: '张三',
  88 + sex: '男',
  89 + number: '1004',
  90 + keybord: '20200206'
  91 + },
  92 + {
  93 + no: 4,
  94 + name: '张三',
  95 + sex: '男',
  96 + number: '1004',
  97 + keybord: '20200206'
  98 + },
  99 + {
  100 + no: 4,
  101 + name: '张三',
  102 + sex: '男',
  103 + number: '1004',
  104 + keybord: '20200206'
  105 + },
  106 + {
  107 + no: 4,
  108 + name: '张三',
  109 + sex: '男',
  110 + number: '1004',
  111 + keybord: '20200206'
  112 + }]
  113 +
  114 + }
  115 + },
  116 + methods: {
  117 + }
  118 +}
  119 +</script>
  120 +<style scoped>
  121 +.blendDetail{
  122 + max-width: 1100px;
  123 + height:calc(100vh - 115px);
  124 + margin:0 auto;
  125 + background: #fff;
  126 + margin-top:15px;
  127 + padding:20px;
  128 + font-size: 14px;
  129 + position: relative;
  130 +}
  131 +.blendDetail p{
  132 + line-height: 40px;
  133 + margin:0;
  134 +}
  135 +.blendDetail .footer{
  136 + width:100%;
  137 + height:40px;
  138 + line-height: 40px;
  139 + text-align: center;
  140 + position: absolute;
  141 + bottom:10px;
  142 + left:0;
  143 + background: #fff;
  144 +
  145 +}
  146 +</style>
... ...
src/views/classes/blend/index.vue 0 → 100644
  View file @74b6a00
  1 +<template>
  2 + <div>
  3 + <Dec :content="content" />
  4 + <div class="blend">
  5 + <div class="top-box">
  6 + <el-button type="primary" @click="creattest">创建考试</el-button>
  7 + </div>
  8 + <el-row style="height:calc(100% - 56px);">
  9 + <el-col :span="6" style="height:100%;border-right:1px solid #eee">
  10 + <ListBox
  11 + ref="listbox"
  12 + title="考试"
  13 + title-bg="#ccc"
  14 + :data="listData"
  15 + active-color="rgb(64, 158, 255)"
  16 + :acitve-index="1"
  17 + @clicklist="clicklist"
  18 + @removelist="removelist"
  19 + @submitname="submitname"
  20 + />
  21 + </el-col>
  22 + <el-col :span="18" style="padding:10px;height:100%;">
  23 + <p style="margin:0;line-height:40px;font-size:12px;">考试时间：2020年5月1日~2020年5月3日<el-button size="small" icon="el-ump-daochu" style="float:right">批量导出考场名单</el-button></p><div style="clear:both" />
  24 +
  25 + <div class="class-room">
  26 + <div class="class-item" @mousemove="hoverIndex = 0" @mouseout="hoverIndex = -1" @click="listDetail('1234')">
  27 + <el-row>
  28 + <el-col :span="7" style="font-size:80px;"><i class="el-ump-banjiguanli" /></el-col>
  29 + <el-col :span="17">
  30 + <p>考场号：001</p>
  31 + <p>考场人数：30人</p>
  32 + <p>可见范围：全校可见</p>
  33 + <div v-show="hoverIndex==0" class="btn-group">
  34 + <i class="el-ump-daochu " />
  35 + <i class="el-icon-delete" @click.self="delet($event,'1234')" />
  36 + </div>
  37 + </el-col>
  38 + </el-row>
  39 + </div>
  40 + <div class="class-item" @mousemove="hoverIndex = 1" @mouseout="hoverIndex = -1">
  41 + <el-row>
  42 + <el-col :span="7" style="font-size:80px;"><i class="el-ump-banjiguanli" /></el-col>
  43 + <el-col :span="17">
  44 + <p>考场号：002</p>
  45 + <p>考场人数：30人</p>
  46 + <p>可见范围：全校可见</p>
  47 + <div v-show="hoverIndex==1" class="btn-group">
  48 + <i class="el-ump-daochu danger" />
  49 + <i class="el-icon-delete" />
  50 + </div>
  51 + </el-col>
  52 + </el-row>
  53 + </div>
  54 + <div class="class-item" @mousemove="hoverIndex = 2" @mouseout="hoverIndex = -1">
  55 + <el-row>
  56 + <el-col :span="7" style="font-size:80px;"><i class="el-ump-banjiguanli" /></el-col>
  57 + <el-col :span="17">
  58 + <p>考场号：003</p>
  59 + <p>考场人数：30人</p>
  60 + <p>可见范围：全校可见</p>
  61 + <div v-show="hoverIndex==2" class="btn-group">
  62 + <i class="el-ump-daochu danger" />
  63 + <i class="el-icon-delete" />
  64 + </div>
  65 + </el-col>
  66 + </el-row>
  67 + </div>
  68 + <div class="class-item" @mousemove="hoverIndex = 3" @mouseout="hoverIndex = -1">
  69 + <el-row>
  70 + <el-col :span="7" style="font-size:80px;"><i class="el-ump-banjiguanli" /></el-col>
  71 + <el-col :span="17">
  72 + <p>考场号：002</p>
  73 + <p>考场人数：30人</p>
  74 + <p>可见范围：全校可见</p>
  75 + <div v-show="hoverIndex==3" class="btn-group">
  76 + <i class="el-ump-daochu danger" />
  77 + <i class="el-icon-delete" />
  78 + </div>
  79 + </el-col>
  80 + </el-row>
  81 + </div>
  82 + </div>
  83 + </el-col>
  84 + </el-row>
  85 + </div>
  86 +
  87 + <!--创建考试-->
  88 + <el-dialog
  89 + title="创建混班考试"
  90 + :visible.sync="dialogVisible"
  91 + width="50%"
  92 + :before-close="handleClose"
  93 + >
  94 + <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
  95 + <el-tab-pane label="随机划分考场" name="first">
  96 + <el-form ref="random" :model="random" label-width="100px">
  97 + <el-form-item label="考试名称">
  98 + <el-input v-model="random.name" style="width:350px;" />
  99 + </el-form-item>
  100 + <el-form-item label="考试时间">
  101 + <el-date-picker
  102 + v-model="random.date"
  103 + type="daterange"
  104 + range-separator="至"
  105 + start-placeholder="开始日期"
  106 + end-placeholder="结束日期"
  107 + style="width:350px;"
  108 + />
  109 + </el-form-item>
  110 + <el-form-item label="选择年级">
  111 + <el-select v-model="random.grade" placeholder="请选择" style="width:350px;">
  112 + <el-option value="1">一年级</el-option>
  113 + <el-option value="2">二年级</el-option>
  114 + </el-select>
  115 + </el-form-item>
  116 + <el-form-item label="选择班级">
  117 + <el-select v-model="random.classes" multiple placeholder="请选择" style="width:350px;">
  118 + <el-option value="1">1班</el-option>
  119 + <el-option value="2">2班</el-option>
  120 + </el-select>
  121 + </el-form-item>
  122 + <el-form-item label="每个考场人数">
  123 + <el-input v-model="random.number" style="width:350px;" />
  124 + </el-form-item>
  125 + </el-form>
  126 + </el-tab-pane>
  127 + <el-tab-pane label="按考试成绩划分考场" name="second">
  128 + <el-form ref="result" :model="result" label-width="100px">
  129 + <el-form-item label="考试名称">
  130 + <el-input v-model="result.name" style="width:350px;" />
  131 + </el-form-item>
  132 + <el-form-item label="考试时间">
  133 + <el-date-picker
  134 + v-model="result.date"
  135 + type="daterange"
  136 + range-separator="至"
  137 + start-placeholder="开始日期"
  138 + end-placeholder="结束日期"
  139 + style="width:350px;"
  140 + />
  141 + </el-form-item>
  142 + <el-form-item label="选择年级">
  143 + <el-select v-model="result.grade" placeholder="请选择" style="width:350px;">
  144 + <el-option value="1">一年级</el-option>
  145 + <el-option value="2">二年级</el-option>
  146 + </el-select>
  147 + </el-form-item>
  148 + <el-form-item label="选择班级">
  149 + <el-select v-model="result.classes" multiple placeholder="请选择" style="width:350px;">
  150 + <el-option value="1">1班</el-option>
  151 + <el-option value="2">2班</el-option>
  152 + </el-select>
  153 + </el-form-item>
  154 + <el-form-item label="导入成绩">
  155 + <el-upload
  156 + class="upload-demo"
  157 + action="https://jsonplaceholder.typicode.com/posts/"
  158 + :on-preview="handlePreview"
  159 + :on-remove="handleRemove"
  160 + :before-remove="beforeRemove"
  161 + multiple
  162 + :limit="1"
  163 + :on-exceed="handleExceed"
  164 + >
  165 + <el-button size="small" type="primary">点击上传</el-button>
  166 + <el-link type="primary" style="margin-left:35px;">下载成绩单模板</el-link>
  167 + </el-upload>
  168 + </el-form-item>
  169 + <el-form-item label="每个考场人数">
  170 + <el-input v-model="result.number" style="width:350px;" />
  171 + </el-form-item>
  172 + </el-form>
  173 + </el-tab-pane>
  174 + </el-tabs>
  175 + <span slot="footer" class="dialog-footer">
  176 + <el-button @click="dialogVisible = false">取 消</el-button>
  177 + <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
  178 + </span>
  179 + </el-dialog>
  180 + </div>
  181 +</template>
  182 +<script>
  183 +import Dec from '@/components/Dec'
  184 +import ListBox from '@/components/ListBox'
  185 +export default {
  186 + name: 'Blend',
  187 + components: {
  188 + Dec,
  189 + ListBox
  190 + },
  191 + data() {
  192 + return {
  193 + content: '考室信息短期有效，支持随机快速创建或自定义上传',
  194 + value: 0,
  195 + searchtext: '',
  196 + hoverIndex: -1,
  197 + dialogVisible: false,
  198 + dialogVisible1: true,
  199 + activeName: 'first',
  200 + listData: [
  201 + { id: 0, name: '2020年上学期中考试2020年上学期中考试' },
  202 + { id: 1, name: '2020年入学考试' }
  203 + ],
  204 + random: {
  205 + name: '',
  206 + date: '',
  207 + grade: '',
  208 + classes: '',
  209 + number: ''
  210 + },
  211 + result: {
  212 + name: '',
  213 + date: '',
  214 + grade: '',
  215 + classes: '',
  216 + number: ''
  217 + }
  218 + }
  219 + },
  220 + methods: {
  221 + search() {
  222 + console.log(1)
  223 + },
  224 + clicklist(index) {
  225 + console.log(index)
  226 + },
  227 + removelist(index) {
  228 + console.log(index)
  229 + },
  230 + submitname(index) {
  231 + this.listData[index].edit = false
  232 + },
  233 + creattest() {
  234 + this.dialogVisible = true
  235 + },
  236 + handleClose(done) {
  237 + this.$confirm('确认关闭？')
  238 + .then(_ => {
  239 + done()
  240 + })
  241 + .catch(_ => {})
  242 + },
  243 + handleClick(tab, event) {
  244 + console.log(tab, event)
  245 + },
  246 + handleRemove(file, fileList) {
  247 + console.log(file, fileList)
  248 + },
  249 + handlePreview(file) {
  250 + console.log(file)
  251 + },
  252 + handleExceed(files, fileList) {
  253 + this.$message.warning(`当前限制选择 1 个文件`)
  254 + },
  255 + beforeRemove(file, fileList) {
  256 + return this.$confirm(`确定移除 ${file.name}？`)
  257 + },
  258 + listDetail(id) {
  259 + this.$router.push({ path: '/classes/blendDetail', query: { id }})
  260 + console.log(id)
  261 + },
  262 + delet(event, id) {
  263 + event.stopPropagation()
  264 + console.log(id)
  265 + }
  266 + }
  267 +}
  268 +</script>
  269 +<style scoped>
  270 +.blend{
  271 + max-width: 1100px;
  272 + height:calc(100vh - 115px);
  273 + margin:0 auto;
  274 + background: #fff;
  275 + margin-top:15px;
  276 + padding:20px;
  277 +}
  278 +.top-box{
  279 + padding-bottom: 15px;
  280 + border-bottom: 1px solid #ccc;
  281 +}
  282 +.class-item{
  283 + width:49%;
  284 + float: left;
  285 + border:1px solid #888;
  286 + padding:10px 0;
  287 + border-radius: 20px;
  288 + margin-bottom:5px;
  289 + position: relative;
  290 +}
  291 +.class-item:nth-child(2n+1){
  292 + margin-right:2%;
  293 +}
  294 +.class-item p span{
  295 + font-size: 12px;
  296 + color:#888;
  297 +}
  298 +.class-item .left20{
  299 + margin-left: 20px;
  300 +}
  301 +.class-item .left30{
  302 + margin-left: 30px;
  303 +}
  304 +.btn-group{
  305 + font-size: 20px;
  306 + position: absolute;
  307 + top:0px;
  308 + right:20px;
  309 +}
  310 +.btn-group i{
  311 + cursor: pointer;
  312 + margin-right: 5px;
  313 +}
  314 +.class-room{
  315 + height:calc(100% - 32px);
  316 + overflow: auto;
  317 +}
  318 +</style>
... ...
src/views/classes/classes/index.vue 0 → 100644
  View file @74b6a00
  1 +<template>
  2 + <div>
  3 + <Dec :content="content" />
  4 + <div class="classes">
  5 + <div class="top-box">
  6 + <el-row>
  7 + <el-col :span="12">
  8 + <el-button type="primary" @click="$router.push('/classes/add')">添加班级</el-button>
  9 + </el-col>
  10 + <el-col :span="12">
  11 + <span>状态：</span>
  12 + <el-select v-model="value" style="width:120px" placeholder="请选择">
  13 + <el-option :value="0" label="全部" />
  14 + <el-option :value="1" label="毕业" />
  15 + <el-option :value="2" label="在读启用" />
  16 + <el-option :value="3" label="在读禁用" />
  17 + </el-select>
  18 + <el-input
  19 + v-model="searchtext"
  20 + placeholder="班级名称或编号"
  21 + style="width:220px"
  22 + >
  23 + <i slot="suffix" class="el-input__icon el-icon-search" @click="search" />
  24 + </el-input>
  25 + </el-col>
  26 + </el-row>
  27 + </div>
  28 + <el-row style="height:calc(100% - 56px);">
  29 + <el-col :span="6" style="height:100%;border-right:1px solid #eee">
  30 + <ListBox
  31 + ref="listbox"
  32 + title="年级"
  33 + title-bg="#ccc"
  34 + :data="listData"
  35 + active-color="rgb(64, 158, 255)"
  36 + :acitve-index="1"
  37 + @clicklist="clicklist"
  38 + @removelist="removelist"
  39 + @submitname="submitname"
  40 + />
  41 + </el-col>
  42 + <el-col :span="18" style="padding:10px;">
  43 + <p style="text-align:right;padding-bottom:10px;margin:0;line-height:40px;"><el-button size="small" icon="el-ump-qingchu">删除毕业班级</el-button></p>
  44 + <div style="clear:both" />
  45 + <div class="class-item" @mousemove="hoverIndex = 0" @mouseout="hoverIndex = -1" @click="classDetail('1234')">
  46 + <el-row>
  47 + <el-col :span="4" style="font-size:80px;"><i class="el-ump-banjiguanli" /></el-col>
  48 + <el-col :span="18">
  49 + <p>一年八班 <span>（在读启用）</span></p>
  50 + <p><span>小学一年级</span><span class="left20">55人</span><span class="left20">班级编号：2134</span></p>
  51 + <p><span>班主任：李四</span><span class="left30">任课老师：张三、王欧、李帅</span></p>
  52 + <div v-show="hoverIndex==0" class="btn-group">
  53 + <i class="el-ump-jinzhi" />
  54 + <i class="el-icon-edit" @click="edit($event,'1234')" />
  55 + <i class="el-icon-delete" />
  56 + </div>
  57 + </el-col>
  58 + </el-row>
  59 + </div>
  60 + <div class="class-item" style="color:#888" @mouseover="hoverIndex=1" @mouseout="hoverIndex=-1">
  61 + <el-row>
  62 + <el-col :span="4" style="font-size:80px;"><i class="el-ump-banjiguanli" /></el-col>
  63 + <el-col :span="18">
  64 + <p>一年八班 <span>（在读禁用）</span></p>
  65 + <p><span>小学一年级</span><span class="left20">55人</span><span class="left20">班级编号：2134</span></p>
  66 + <p><span>班主任：李四</span><span class="left30">任课老师：张三、王欧、李帅</span></p>
  67 + <div v-show="hoverIndex==1" class="btn-group">
  68 + <i class="el-ump-jinzhi" />
  69 + <i class="el-icon-edit" />
  70 + <i class="el-icon-delete" />
  71 + </div>
  72 + </el-col>
  73 + </el-row>
  74 + </div>
  75 + </el-col>
  76 + </el-row>
  77 + </div>
  78 + </div>
  79 +</template>
  80 +<script>
  81 +import Dec from '@/components/Dec'
  82 +import ListBox from '@/components/ListBox'
  83 +export default {
  84 + name: 'Classes',
  85 + components: {
  86 + Dec,
  87 + ListBox
  88 + },
  89 + data() {
  90 + return {
  91 + content: '信息管理员或者班主任可创建和管理班级',
  92 + value: 0,
  93 + searchtext: '',
  94 + hoverIndex: -1,
  95 + listData: [
  96 + { id: 0, name: '全部（30）', removeIcon: false },
  97 + { id: 2, name: '小学一年级（10）' },
  98 + { id: 3, name: '小学二年级（10）' },
  99 + { id: 4, name: '小学三年级（10）' }
  100 + ]
  101 + }
  102 + },
  103 + methods: {
  104 + search() {
  105 + console.log(1)
  106 + },
  107 + clicklist(index) {
  108 + console.log(index)
  109 + },
  110 + removelist(index) {
  111 + console.log(index)
  112 + },
  113 + submitname(index) {
  114 + this.listData[index].edit = false
  115 + },
  116 + classDetail(id) {
  117 + console.log(id)
  118 + this.$router.push({ path: '/classes/classDetail', query: { id }})
  119 + },
  120 + edit(event, id) {
  121 + event.stopPropagation()
  122 + this.$router.push({ path: '/classes/add', query: { id }})
  123 + }
  124 + }
  125 +}
  126 +</script>
  127 +<style scoped>
  128 +.classes{
  129 + max-width: 1100px;
  130 + height:calc(100vh - 115px);
  131 + margin:0 auto;
  132 + background: #fff;
  133 + margin-top:15px;
  134 + padding:20px;
  135 +}
  136 +.top-box{
  137 + padding-bottom: 15px;
  138 + border-bottom: 1px solid #ccc;
  139 +}
  140 +.class-item{
  141 + border:1px solid #888;
  142 + padding:10px 0;
  143 + border-radius: 20px;
  144 + margin-bottom:5px;
  145 + position: relative;
  146 +}
  147 +.class-item p span{
  148 + font-size: 12px;
  149 + color:#888;
  150 +}
  151 +.class-item .left20{
  152 + margin-left: 20px;
  153 +}
  154 +.class-item .left30{
  155 + margin-left: 30px;
  156 +}
  157 +.btn-group{
  158 + font-size: 20px;
  159 + position: absolute;
  160 + top:10px;
  161 + right:20px;
  162 +}
  163 +.btn-group i{
  164 + cursor: pointer;
  165 + margin-right: 5px;
  166 +}
  167 +</style>
... ...
src/views/classes/classes/page/add.vue 0 → 100644
  View file @74b6a00
  1 +<template>
  2 + <div>
  3 + <Dec :content="content" />
  4 + <div class="add">
  5 + <p class="footer">
  6 + <el-button v-show="active==1" type="primary" @click="next">下一步</el-button>
  7 + <el-button v-show="active==1" type="danger" @click="close">取消</el-button>
  8 +
  9 + <el-button v-show="active==2" type="primary" @click="prev">上一步</el-button>
  10 + <el-button v-show="active==2" type="primary" @click="save">保存</el-button>
  11 + </p>
  12 + <div style="height:calc(100% - 40px);overflow:auto;">
  13 + <el-steps :active="active" style="width:50%;margin:0 auto;">
  14 + <el-step title="添加班级信息" />
  15 + <el-step title="添加学生信息" />
  16 + </el-steps>
  17 + <div v-show="active==1">
  18 + <el-form ref="classes" :model="classes" label-width="100px" style="margin-top:30px;">
  19 + <el-form-item label="班级名称">
  20 + <el-input v-model="classes.name" style="width:400px;" placeholder="请输入班级名称" />
  21 + </el-form-item>
  22 + <el-form-item label="年级">
  23 + <el-select v-model="classes.lengthof" style="width:198px;" placeholder="请选择">
  24 + <el-option
  25 + v-for="item in lengthof"
  26 + :key="item.value"
  27 + :label="item.label"
  28 + :value="item.value"
  29 + />
  30 + </el-select>
  31 + <el-select v-model="classes.grade" style="width:198px;" placeholder="请选择">
  32 + <el-option
  33 + v-for="item in grade"
  34 + :key="item.value"
  35 + :label="item.label"
  36 + :value="item.value"
  37 + />
  38 + </el-select>
  39 + </el-form-item>
  40 + <el-form-item label="班主任">
  41 + <el-select v-model="classes.tutor" style="width:400px;" placeholder="请选择">
  42 + <el-option
  43 + v-for="item in tutor"
  44 + :key="item.value"
  45 + :label="item.label"
  46 + :value="item.value"
  47 + />
  48 + </el-select>
  49 + </el-form-item>
  50 + <el-form-item label="任课老师">
  51 + <el-select v-model="classes.subjectTeacher" style="width:400px;" multiple placeholder="请选择">
  52 + <el-option
  53 + v-for="item in subjectTeacher"
  54 + :key="item.value"
  55 + :label="item.label"
  56 + :value="item.value"
  57 + />
  58 + </el-select>
  59 + </el-form-item>
  60 + <el-form-item label="状态">
  61 + <el-select v-model="classes.state" style="width:400px;" placeholder="请选择">
  62 + <el-option
  63 + v-for="item in state"
  64 + :key="item.value"
  65 + :label="item.label"
  66 + :value="item.value"
  67 + />
  68 + </el-select>
  69 + </el-form-item>
  70 + </el-form>
  71 + </div>
  72 + <div v-show="active==2">
  73 + <div class="btn-group">
  74 + <el-button type="primary" @click="studentdialog=true">添加学生</el-button>
  75 + <el-button type="primary" @click="importdialog=true">批量导入</el-button>
  76 + <el-button type="danger">批量删除</el-button>
  77 + </div>
  78 + <el-table
  79 + :data="tableData"
  80 + style="width: 100%"
  81 + @selection-change="getdata"
  82 + >
  83 + <el-table-column
  84 + type="selection"
  85 + width="55"
  86 + />
  87 + <el-table-column
  88 + prop="no"
  89 + label="序号"
  90 + width="180"
  91 + />
  92 + <el-table-column
  93 + prop="name"
  94 + label="姓名"
  95 + width="180"
  96 + />
  97 + <el-table-column
  98 + prop="sex"
  99 + label="性别"
  100 + />
  101 + <el-table-column
  102 + prop="number"
  103 + label="学号"
  104 + />
  105 + <el-table-column
  106 + prop="keybord"
  107 + label="键盘ID"
  108 + />
  109 + </el-table>
  110 + </div>
  111 + </div>
  112 + </div>
  113 + <!--添加学生-->
  114 + <el-dialog
  115 + title="添加学生"
  116 + :visible.sync="studentdialog"
  117 + width="30%"
  118 + >
  119 +
  120 + <el-form ref="student" :model="student" label-width="100px" style="margin-top:30px;">
  121 + <el-form-item label="姓名">
  122 + <el-input v-model="student.name" style="width:300px;" placeholder="请输入学生名称" />
  123 + </el-form-item>
  124 + <el-form-item label="学号">
  125 + <el-input v-model="student.number" style="width:300px;" placeholder="请输入学号" />
  126 + </el-form-item>
  127 + <el-form-item label="性别">
  128 + <el-select v-model="student.sex" style="width:300px;" placeholder="请选择性别">
  129 + <el-option value="0" label="男" />
  130 + <el-option value="1" label="女" />
  131 + </el-select>
  132 + </el-form-item>
  133 + <el-form-item label="答题器编号">
  134 + <el-input v-model="student.keybord" style="width:300px;" placeholder="请输入答题器编号" />
  135 + </el-form-item>
  136 + </el-form>
  137 + <span slot="footer" class="dialog-footer">
  138 + <el-button @click="studentdialog = false">取 消</el-button>
  139 + <el-button type="primary" @click="studentdialog = false">保 存</el-button>
  140 + </span>
  141 + </el-dialog>
  142 + <!--批量导入-->
  143 + <el-dialog
  144 + title="批量导入学生"
  145 + :visible.sync="importdialog"
  146 + width="30%"
  147 + >
  148 + <p>第一步：下载模板并编辑完成学生的信息 <el-link type="primary"><i class="el-ump-xiazai" />下载导入模板</el-link></p>
  149 + <p>第二步：上传编辑完成的模板文件，完成导入</p>
  150 + <el-upload
  151 + class="upload-demo"
  152 + action="https://jsonplaceholder.typicode.com/posts/"
  153 + :on-preview="handlePreview"
  154 + :on-remove="handleRemove"
  155 + :before-remove="beforeRemove"
  156 + multiple
  157 + :limit="1"
  158 + :on-exceed="handleExceed"
  159 + >
  160 + <el-button size="small" type="primary">选择文件并上传</el-button>
  161 + <!-- <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div> -->
  162 + </el-upload>
  163 + <span slot="footer" class="dialog-footer">
  164 + <el-button @click="importdialog = false">取 消</el-button>
  165 + <el-button type="primary" @click="importdialog = false">保 存</el-button>
  166 + </span>
  167 + </el-dialog>
  168 + </div>
  169 +</template>
  170 +<script>
  171 +import Dec from '@/components/Dec'
  172 +export default {
  173 + name: 'Add',
  174 + components: {
  175 + Dec
  176 + },
  177 + data() {
  178 + return {
  179 + content: '',
  180 + active: 1,
  181 + show: true,
  182 + studentdialog: false,
  183 + importdialog: false,
  184 + lengthof: [
  185 + { label: '小学', value: '1' },
  186 + { label: '中学', value: '2' },
  187 + { label: '大学', value: '3' }
  188 + ],
  189 + grade: [
  190 + { label: '一年级', value: '1' },
  191 + { label: '二年级', value: '2' },
  192 + { label: '三年级', value: '3' },
  193 + { label: '四年级', value: '4' }
  194 + ],
  195 + tutor: [
  196 + { label: '李老师', value: '1' },
  197 + { label: '张老师', value: '2' }
  198 + ],
  199 + subjectTeacher: [
  200 + { label: '数学老师', value: '1' },
  201 + { label: '语文老师', value: '2' },
  202 + { label: '英文老师', value: '3' }
  203 + ],
  204 + state: [
  205 + { label: '在读启用', value: '1' },
  206 + { label: '在读禁用', value: '2' },
  207 + { label: '已毕业', value: '3' }
  208 + ],
  209 + classes: {
  210 + name: '',
  211 + lengthof: '',
  212 + grade: '',
  213 + tutor: '',
  214 + subjectTeacher: '',
  215 + state: ''
  216 +
  217 + },
  218 + tableData: [
  219 + { no: '0', name: '张三', sex: '男', number: '0001', keybord: '20200101' },
  220 + { no: '1', name: '李四', sex: '男', number: '0002', keybord: '20200102' },
  221 + { no: '2', name: '王五', sex: '男', number: '0003', keybord: '20200103' }
  222 + ],
  223 + student: {
  224 + name: '',
  225 + sex: '',
  226 + number: '',
  227 + keybord: ''
  228 + }
  229 +
  230 + }
  231 + },
  232 + methods: {
  233 + next() {
  234 + this.active = 2
  235 + },
  236 + close() {
  237 + this.$router.push('/classes/classes')
  238 + },
  239 + prev() {
  240 + this.active = 1
  241 + },
  242 + save() {
  243 + this.$router.push('/classes/classes')
  244 + },
  245 + getdata(data) {
  246 + console.log(data)
  247 + },
  248 + handleRemove(file, fileList) {
  249 + console.log(file, fileList)
  250 + },
  251 + handlePreview(file) {
  252 + console.log(file)
  253 + },
  254 + handleExceed(files, fileList) {
  255 + this.$message.warning(`当前限制选择 1 个文件`)
  256 + },
  257 + beforeRemove(file, fileList) {
  258 + return this.$confirm(`确定移除 ${file.name}？`)
  259 + }
  260 +
  261 + }
  262 +}
  263 +</script>
  264 +<style scoped>
  265 +.add{
  266 + max-width: 1100px;
  267 + height:calc(100vh - 115px);
  268 + margin:0 auto;
  269 + background: #fff;
  270 + margin-top:15px;
  271 + padding:20px;
  272 + font-size: 14px;
  273 + position: relative;
  274 +}
  275 +.add p{
  276 + line-height: 40px;
  277 + margin:0;
  278 +}
  279 +.add .footer{
  280 + width:100%;
  281 + height:40px;
  282 + line-height: 40px;
  283 + text-align: center;
  284 + position: absolute;
  285 + bottom:10px;
  286 + left:0;
  287 + background: #fff;
  288 +
  289 +}
  290 +.el-tag{
  291 + margin-right:5px;
  292 +}
  293 +.btn-group{
  294 + margin-top:30px;
  295 +}
  296 +</style>
... ...
src/views/classes/classes/page/detail.vue 0 → 100644
  View file @74b6a00
  1 +<template>
  2 + <div>
  3 + <Dec :content="content" />
  4 + <div class="classDetail">
  5 + <p class="footer"><el-button type="primary" @click="$router.push('/classes/classes')">返回</el-button></p>
  6 + <div style="height:calc(100% - 40px);overflow:auto;">
  7 + <p>班级名称：一年级八班</p>
  8 + <p>选择学制：小学</p>
  9 + <p>选择年级：一年级</p>
  10 + <p>入学年份：2020年09月</p>
  11 + <p>班主任：<el-tag>蔡徐坤</el-tag></p>
  12 + <p>任课老师：<el-tag>周杰伦</el-tag><el-tag>蔡依林</el-tag></p>
  13 + <p>班级名单：</p>
  14 + <p style="text-align:right;padding-right:10px;">
  15 + <el-button type="primary" size="small">导出名单</el-button>
  16 + </p>
  17 + <el-table
  18 + :data="tableData"
  19 + style="width: 100%"
  20 + >
  21 + <el-table-column
  22 + prop="no"
  23 + label="序号"
  24 + width="180"
  25 + />
  26 + <el-table-column
  27 + prop="name"
  28 + label="姓名"
  29 + width="180"
  30 + />
  31 + <el-table-column
  32 + prop="sex"
  33 + label="性别"
  34 + width="180"
  35 + />
  36 + <el-table-column
  37 + prop="number"
  38 + label="学号"
  39 + width="180"
  40 + />
  41 + <el-table-column
  42 + prop="keybord"
  43 + label="键盘ID"
  44 + />
  45 + </el-table>
  46 + </div>
  47 + </div>
  48 + </div>
  49 +</template>
  50 +<script>
  51 +import Dec from '@/components/Dec'
  52 +export default {
  53 + name: 'Detail',
  54 + components: {
  55 + Dec
  56 + },
  57 + data() {
  58 + return {
  59 + content: '',
  60 + tableData: [{
  61 + no: 1,
  62 + name: '张三',
  63 + sex: '男',
  64 + number: '1001',
  65 + keybord: '20200203'
  66 + }, {
  67 + no: 2,
  68 + name: '张三',
  69 + sex: '男',
  70 + number: '1002',
  71 + keybord: '20200204'
  72 + }, {
  73 + no: 3,
  74 + name: '张三',
  75 + sex: '男',
  76 + number: '1003',
  77 + keybord: '20200205'
  78 + }, {
  79 + no: 4,
  80 + name: '张三',
  81 + sex: '男',
  82 + number: '1004',
  83 + keybord: '20200206'
  84 + },
  85 + {
  86 + no: 4,
  87 + name: '张三',
  88 + sex: '男',
  89 + number: '1004',
  90 + keybord: '20200206'
  91 + },
  92 + {
  93 + no: 4,
  94 + name: '张三',
  95 + sex: '男',
  96 + number: '1004',
  97 + keybord: '20200206'
  98 + },
  99 + {
  100 + no: 4,
  101 + name: '张三',
  102 + sex: '男',
  103 + number: '1004',
  104 + keybord: '20200206'
  105 + },
  106 + {
  107 + no: 4,
  108 + name: '张三',
  109 + sex: '男',
  110 + number: '1004',
  111 + keybord: '20200206'
  112 + }]
  113 +
  114 + }
  115 + },
  116 + methods: {
  117 + }
  118 +}
  119 +</script>
  120 +<style scoped>
  121 +.classDetail{
  122 + max-width: 1100px;
  123 + height:calc(100vh - 115px);
  124 + margin:0 auto;
  125 + background: #fff;
  126 + margin-top:15px;
  127 + padding:20px;
  128 + font-size: 14px;
  129 + position: relative;
  130 +}
  131 +.classDetail p{
  132 + line-height: 40px;
  133 + margin:0;
  134 +}
  135 +.classDetail .footer{
  136 + width:100%;
  137 + height:40px;
  138 + line-height: 40px;
  139 + text-align: center;
  140 + position: absolute;
  141 + bottom:10px;
  142 + left:0;
  143 + background: #fff;
  144 +
  145 +}
  146 +.el-tag{
  147 + margin-right:5px;
  148 +}
  149 +</style>
... ...