开班功能人员可选

src/views/classMessage/classMessage/components/initClass.vue

@@ -0,0 +1,488 @@
+<template>
+  <el-dialog v-loading="loading" :visible.sync="visible" :title="title" :before-close="close" width="90%" top="50px">
+    <el-row>
+      <el-col :span="18">
+        <el-form ref="form" :rules="rules" :model="form" label-width="110px">
+          <el-row :gutter="10">
+            <el-col :span="8">
+              <el-form-item label="班级名称" prop="CLASS_NAME">
+                <el-input
+                  id="CLASS_NAME"
+                  ref="CLASS_NAME"
+                  v-model="form.CLASS_NAME"
+                  :disabled="isShow"
+                  style="width:  100%"
+                  maxlength="255"
+                  placeholder="这里输入班级名称..."
+                  title="班级名称"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="开班时间" prop="OPENING_TIME">
+                <el-date-picker
+                  v-model="form.OPENING_TIME"
+                  :disabled="isShow"
+                  type="date"
+                  value-format="yyyy-MM-dd"
+                  placeholder="选择日期"
+                  style="width: 100%"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="培训地点" prop="PLACE">
+                <el-select v-model="form.PLACE" :disabled="isShow" placeholder="请选择" style="width:  100%">
+                  <el-option
+                    v-for="item in warehouse.placeList"
+                    :key="item.DICTIONARIES_ID"
+                    :label="item.NAME"
+                    :value="item.DICTIONARIES_ID"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="培训类型" prop="TRAINING_TYPE">
+                <el-select v-model="form.TRAINING_TYPE" :disabled="isShow" placeholder="请选择" style="width:  100%">
+                  <el-option
+                    v-for="item in warehouse.trainingTypeList"
+                    :key="item.DICTIONARIES_ID"
+                    :label="item.NAME"
+                    :value="item.DICTIONARIES_ID"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="班级容量" prop="CLASS_SIZE">
+                <el-select v-model="form.CLASS_SIZE" :disabled="isShow" placeholder="请选择" style="width:  100%" @change="changePeopleList">
+                  <el-option
+                    v-for="item in warehouse.classSizeList"
+                    :key="item.DICTIONARIES_ID"
+                    :label="item.DICTIONARIES_ID"
+                    :value="item.DICTIONARIES_ID"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col v-if="false" :span="8">
+              <el-form-item v-if="false" label="培训有效期" prop="VALIDITY_PERIOD">
+                <el-date-picker
+                  v-model="form.VALIDITY_PERIOD"
+                  :disabled="isShow"
+                  type="daterange"
+                  value-format="yyyy-MM-dd"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  style="width:  100%"/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="24">
+              <el-divider content-position="center">搜索条件</el-divider>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="归属企业">
+                <el-select v-model="util.BELONG_TO_CORP" :disabled="isShow" placeholder="请选择" style="width:  100%" @change="getPeopleList">
+                  <el-option
+                    v-for="item in warehouse.companyList"
+                    :key="item.BELONG_TO_CORP"
+                    :label="item.BELONG_TO_CORP_NAME"
+                    :value="item.BELONG_TO_CORP"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="24">
+              <el-table
+                v-loading="loading"
+                ref="multipleTable"
+                :data="peopleList"
+                :row-key="getRowKey"
+                :header-cell-style="{'font-weight': 'bold','color': '#000'}"
+                tooltip-effect="dark"
+                height="450px"
+                border
+                fit
+                highlight-current-row
+                @select="updateSelect"
+
+              >
+                <el-table-column :reserve-selection="true" type="selection" width="55" align="center"/>
+                <el-table-column type="index" label="序号" width="50" align="center"/>
+                <el-table-column prop="USERNAME" label="用户名"/>
+                <el-table-column prop="NAME" label="姓名"/>
+                <el-table-column prop="SEX" width="50px" label="性别">
+                  <template slot-scope="{row}">
+                    {{ row.SEX === '0' ? '男' : '女' }}
+                  </template>
+                </el-table-column>
+                <el-table-column prop="CARD_ID" label="身份证号" width="150px"/>
+                <el-table-column prop="BELONG_TO_CORP_NAME" label="所属企业"/>
+                <el-table-column prop="DEPARTMENT_NAME" label="部门"/>
+                <el-table-column prop="PHOTO" label="免冠照片" width="120px">
+                  <template slot-scope="{row}">
+                    <el-image v-if="getShowPicture(row)" :src="config.fileUrl+row.PHOTO" :preview-src-list="[config.fileUrl+row.PHOTO]" :z-index="9999" style="width: 100px; height: 100px"/>
+                    <img v-if="!getShowPicture(row)" src="../../../../assets/images/peopleHead.png" alt="" style="width: 100px; height: 100px">
+                  </template>
+                </el-table-column>
+                <el-table-column prop="PHONE" label="联系电话"/>
+                <el-table-column prop="STATUS" label="培训结果">
+                  <template slot-scope="{row}">
+                    <template v-if="row.STATUS === '0'">不合格</template>
+                    <template v-else-if="row.STATUS === '1'">合格</template>
+                  </template>
+                </el-table-column>
+                <el-table-column label="操作" align="center" width="200">
+                  <template slot-scope="{row}">
+                    <el-button
+                      v-if="form.CLASS_STATUS === '2' && row.STATUS === '1'"
+                      type="primary"
+                      icon="el-icon-edit"
+                      size="mini"
+                      @click="getUserInfo(row)">查看
+                    </el-button>
+                    <el-button
+                      v-if="row.STATUS === '0' && form.CLASS_STATUS === '1'"
+                      type="primary"
+                      icon="el-icon-edit"
+                      size="mini"
+                      @click="changFlag(row,'1')">合格
+                    </el-button>
+                    <el-button
+                      v-if="row.STATUS == '1' && form.CLASS_STATUS === '1'"
+                      type="danger"
+                      icon="el-icon-delete"
+                      size="mini"
+                      @click="changFlag(row,'0')">不合格
+                    </el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-col>
+          </el-row>
+        </el-form>
+      </el-col>
+      <el-col :span="6">
+        <div style="margin-left: 10px">
+          <div class="el-form-item__label">已选择人员名称：</div>
+          <el-table
+            :data="selectPeopleList"
+            border
+            height="600px"
+            style="width: 100%;margin-left: 10px">
+            <el-table-column prop="NAME" fixed label="姓名" width="150px" style="width: 150px"/>
+            <el-table-column prop="USERNAME" label="用户名" width="150px" style="width: 150px"/>
+            <el-table-column prop="BELONG_TO_CORP_NAME" label="所属企业" width="150px" style="width: 150px"/>
+            <el-table-column prop="CARD_ID" label="身份证号" width="150px"/>
+          </el-table>
+        </div>
+      </el-col>
+    </el-row>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="close">取 消</el-button>
+      <el-button v-if="!form.CLASS_STATUS || form.CLASS_STATUS === ''" type="primary" @click="confirm">确 定</el-button>
+      <el-button v-if="form.CLASS_STATUS === '0' || form.CLASS_STATUS === '1'" type="primary" @click="getExcel(form.CLASS_MESSAGE_ID)">导出excel</el-button>
+      <el-button v-if="form.CLASS_STATUS === '1'" type="primary" @click="graduation(form.CLASS_MESSAGE_ID)">班级结业</el-button>
+      <el-button v-if="form.CLASS_STATUS === '2'" type="primary" @click="getCertificate(form.CLASS_MESSAGE_ID)">导出结业证书</el-button>
+    </div>
+    <user ref="userInfo" append-to-body/>
+    <user_pdf ref="userPdf" append-to-body/>
+  </el-dialog>
+</template>
+<script>
+import Pagination from '@/components/Pagination' // 通过 el-pagination二次打包
+import { requestFN } from '@/utils/request'
+import waves from '@/directive/waves' // waves directive
+import axios from 'axios'
+import dayjs from 'dayjs' // waves directive
+import user from './user.vue'
+import User_pdf from './user_pdf.vue'
+export default {
+  components: { User_pdf, Pagination, user },
+  directives: { waves },
+  props: {
+    title: {
+      type: String,
+      default: ''
+    },
+    isShow: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      config: config,
+      loading: false,
+      visible: false,
+      form: {
+        CLASS_NAME: '', // 班级名称
+        OPENING_TIME: '', // 开班时间
+        PLACE: '', // 培训地点
+        TRAINING_TYPE: '', // 培训类型
+        CLASS_SIZE: '', // 班级容量
+        CLASS_STATUS: '', // 班级状态（0-待开班、1-已开班、2-完成）
+        VALIDITY_PERIOD: [],
+        CLASS_MESSAGE_ID: ''
+      },
+      util: {
+        BELONG_TO_CORP: ''
+      },
+      warehouse: {
+        placeList: [],
+        trainingTypeList: [],
+        classSizeList: [
+          { DICTIONARIES_ID: '1' },
+          { DICTIONARIES_ID: '30' },
+          { DICTIONARIES_ID: '50' },
+          { DICTIONARIES_ID: '60' },
+          { DICTIONARIES_ID: '100' },
+          { DICTIONARIES_ID: '150' },
+          { DICTIONARIES_ID: '200' },
+          { DICTIONARIES_ID: '250' },
+          { DICTIONARIES_ID: '300' },
+          { DICTIONARIES_ID: '350' }
+        ],
+        companyList: []
+      },
+      rules: {
+        CLASS_NAME: [{ required: true, message: '班级名称不能为空', trigger: 'blur' }],
+        OPENING_TIME: [{ required: true, message: '开班时间不能为空', trigger: 'blur' }],
+        PLACE: [{ required: true, message: '培训地点不能为空', trigger: 'blur' }],
+        TRAINING_TYPE: [{ required: true, message: '培训类型不能为空', trigger: 'blur' }],
+        CLASS_SIZE: [{ required: true, message: '班级容量不能为空', trigger: 'blur' }],
+        VALIDITY_PERIOD: [{ trigger: 'blur', required: true, message: '请选择时间区间' }]
+      },
+      peopleList: [],
+      selectPeopleList: []
+    }
+  },
+  created() {
+  },
+  methods: {
+    init(e) {
+      this.loading = true
+      this.visible = true
+      if (e && e.CLASS_MESSAGE_ID && e.CLASS_MESSAGE_ID !== '') {
+        this.getInformation(e)
+      } else {
+        this.getPeopleList()
+      }
+      this.getDic()
+    },
+    updateSelect(rows, row) {
+      console.log(rows)
+      if (this.form.CLASS_SIZE === '' || this.form.CLASS_SIZE) {
+        this.$message.error('请先选择班级容量')
+        return
+      }
+      if (rows.length > this.form.CLASS_SIZE) {
+        this.$message.error('已超出班级容量')
+        return
+      }
+      this.selectPeopleList = rows
+    },
+    confirm() {
+      const list = this.$refs.multipleTable.selection
+      if (!list || !list.length || list.length === 0) {
+        this.$message.error('没有人员数据')
+        return
+      }
+      if (list.length > this.form.CLASS_SIZE) {
+        this.$message.error('班级人数超过')
+      }
+      this.form.list = JSON.stringify(list)
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          requestFN(
+            'classMessage/init', this.form
+          ).then((data) => {
+            if (data.code === '0') {
+              this.$message.success('保存成功')
+              this.visible = false
+              this.close()
+              this.$emit('getResult', '')
+            } else {
+              this.$message.error('保存失败')
+            }
+          }).catch((e) => {
+            this.loading = false
+          })
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    close() {
+      this.visible = false
+      this.form = {
+        CLASS_NAME: '', // 班级名称
+        OPENING_TIME: '', // 开班时间
+        PLACE: '', // 培训地点
+        TRAINING_TYPE: '', // 培训类型
+        CLASS_SIZE: '', // 班级容量
+        CLASS_STATUS: ''// 班级状态（0-待开班、1-已开班、2-完成）
+      }
+    },
+    getDic() {
+      let i = 0
+      requestFN(
+        'dictionaries/getLevels', { DICTIONARIES_ID: '617cba77809a44318abc200760d50096' }
+      ).then((data) => {
+        this.warehouse.placeList = data.list
+        if (i >= 3) {
+          this.loading = false
+        } else {
+          i++
+        }
+      }).catch((e) => {
+        this.loading = false
+      })
+      requestFN(
+        'dictionaries/getLevels', { DICTIONARIES_ID: '10ffcf646d354ff0a94630c7435e73fe' }
+      ).then((data) => {
+        this.warehouse.trainingTypeList = data.list
+        if (i >= 3) {
+          this.loading = false
+        } else {
+          i++
+        }
+      }).catch((e) => {
+        this.loading = false
+      })
+      requestFN(
+        '/xgf/user/getAllCorpInfo', {}
+      ).then((data) => {
+        this.warehouse.companyList = data.list
+        if (i >= 3) {
+          this.loading = false
+        } else {
+          i++
+        }
+      }).catch((e) => {
+        this.loading = false
+      })
+    },
+    getRowKey(row) {
+      return row.USER_ID
+    },
+    getPeopleList() {
+      requestFN('/classMessage/getPeopleList', { BELONG_TO_CORP: this.util.BELONG_TO_CORP }).then((data) => {
+        this.peopleList = data.varList
+        this.loading = false
+      }).catch((e) => {
+        this.loading = false
+      })
+    },
+    getInformation(e) {
+      requestFN('/classMessage/goEdit', { CLASS_MESSAGE_ID: e.CLASS_MESSAGE_ID })
+        .then((data) => {
+          if (data.code === '0') {
+            this.form = data.pd
+            this.form.VALIDITY_PERIOD = [this.form.VALIDITY_PERIOD_START, this.form.VALIDITY_PERIOD_END]
+            this.peopleList = this.form.peopleList
+          } else {
+            this.$message.error('数据异常')
+          }
+          this.loading = false
+        }).catch((e) => {
+          this.loading = false
+        })
+    },
+    getExcel(id) {
+      const loading = this.$loading({
+        lock: true,
+        text: '加载中...',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+      axios.get(config.httpurl + '/classMessage/excel?CLASS_MESSAGE_ID=' + id, {
+        responseType: 'blob'
+      }).then(res => {
+        setTimeout(() => {
+          const blob = new Blob([res.data], { type: 'application/vnd.ms-excel' })
+          const downloadElement = document.createElement('a')
+          const href = window.URL.createObjectURL(blob)
+          downloadElement.style.display = 'none'
+          downloadElement.href = href
+          downloadElement.download = dayjs().format('YYYY-MM-DD HH:mm:ss')
+          document.body.appendChild(downloadElement)
+          downloadElement.click()
+          document.body.removeChild(downloadElement)
+          window.URL.revokeObjectURL(href)
+          this.$emit('getResult', '')
+          loading.close()
+          this.close()
+        }, 2000)
+      }).catch((e) => {
+        console.log(e)
+        loading.close()
+        this.$message.error('导出失败,或未查询到隐患')
+      })
+    },
+    changFlag(row, flag) {
+      row.STATUS = flag
+      requestFN('/classMessage/enterGrades', { CLASS_INFO_ID: row.CLASS_INFO_ID, STATUS: flag })
+        .then((data) => {
+          this.$message({
+            type: 'success',
+            message: '操作成功'
+          })
+          this.$emit('getResult', '')
+        }).catch((e) => {
+        })
+    },
+    graduation(id) {
+      this.$confirm('确定要结业吗, 结业后成绩将无法更改', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        requestFN('/classMessage/graduation', { CLASS_MESSAGE_ID: id })
+          .then((data) => {
+            this.$message({
+              type: 'success',
+              message: '操作成功'
+            })
+            this.visible = false
+            this.loading = false
+            this.close()
+            this.$emit('getResult', '')
+          }).catch((e) => {
+            this.loading = false
+          })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取操作'
+        })
+      })
+    },
+    getUserInfo(row) {
+      console.log(row)
+      this.$refs.userInfo.init(row)
+    },
+    getCertificate(CLASS_MESSAGE_ID) {
+      this.$refs.userPdf.init({ CLASS_MESSAGE_ID: CLASS_MESSAGE_ID })
+    },
+    changePeopleList() {
+      requestFN('/classMessage/getPeopleList?showCount=' + this.form.CLASS_SIZE + '&currentPage=1').then((data) => {
+        this.peopleList = data.varList
+        for (let i = 0; i < this.peopleList.length; i++) {
+          this.peopleList[i].STATUS = ''
+        }
+        this.loading = false
+      }).catch((e) => {
+        this.loading = false
+      })
+    },
+    getShowPicture(row) {
+      if (row.PHOTO && row.PHOTO !== '' && (row.PHOTO.indexOf('.jpg') >= 0 || row.PHOTO.indexOf('.png') >= 0 || row.PHOTO.indexOf('.jpeg') >= 0)) {
+        return true
+      }
+    }
+  }
+}
+
+</script>

src/views/classMessage/classMessage/components/list.vue

@@ -87,6 +87,7 @@
       <pagination :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
     </div>
     <edit ref="edit" :title="title" :is-show="isShow" @getResult = "getList"/>
+    <init-class ref="initClass" :title="title" :is-show="isShow" @getResult = "getList"/>
     <upload-excel ref="uploadExcel" title="上传" append-to-body @getChoose="getFile"/>
   </div>
 </template>
@@ -97,8 +98,9 @@ import waves from '@/directive/waves' // waves directive
 import edit from './edit.vue'
 import { upload } from '@/utils/upload'
 import uploadExcel from '../../../../components/uploadExcel/index.vue'
+import InitClass from './initClass.vue'
 export default {
-  components: { uploadExcel, Pagination, edit },
+  components: { InitClass, uploadExcel, Pagination, edit },
   directives: { waves },
   data() {
     return {
@@ -180,7 +182,7 @@ export default {
     handleAdd() {
       this.isShow = false
       this.title = '新增'
-      this.$refs.edit.init()
+      this.$refs.initClass.init()
     },
     // 修改
     handleEdit(ID) {