|
@@ -4,30 +4,73 @@
|
|
|
* @Autor: XuTongZhang
|
|
|
* @Date: 2020-07-28 16:00:46
|
|
|
* @LastEditors: XuTongZhang
|
|
|
- * @LastEditTime: 2020-07-29 09:59:20
|
|
|
+ * @LastEditTime: 2020-07-30 20:33:59
|
|
|
-->
|
|
|
<template>
|
|
|
<div class="indexPage">
|
|
|
- <v-input :btn="btn" :list="list"></v-input>
|
|
|
+ <v-input :btn="btn" :list="list" @add="add"></v-input>
|
|
|
<v-table
|
|
|
:table="table"
|
|
|
:tableList="tableList"
|
|
|
:sortType="true"
|
|
|
:queryData="queryData"
|
|
|
+ @details="details"
|
|
|
+ @editor="editor"
|
|
|
+ @del="del"
|
|
|
></v-table>
|
|
|
<v-pager @page="callPage" :total="totalrecords"></v-pager>
|
|
|
- <el-dialog :visible.sync="dialogFormVisible">
|
|
|
- <el-form :model="form" label-width="140px">
|
|
|
- <el-form-item label="职位名称">
|
|
|
- <el-input v-model="form.name" autocomplete="off"></el-input>
|
|
|
+ <el-dialog :visible.sync="dialogFormVisible" width="600px" :before-close="close">
|
|
|
+ <el-form :model="form" ref="form" label-width="140px" label-position="left">
|
|
|
+ <el-form-item label="流程名称" prop="processName" :rules="{
|
|
|
+ required: true, message: '问题不能为空', trigger: 'blur'
|
|
|
+ }">
|
|
|
+ <el-input v-model.trim="form.processName" v-if="state!=2" autocomplete="off"></el-input>
|
|
|
+ <div v-else>{{form.processName}}</div>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="职位描述">
|
|
|
- <el-input type="textarea" :rows="4" resize="none" placeholder="请输入内容" v-model="form.textarea"></el-input>
|
|
|
+ <el-form-item
|
|
|
+ v-for="(item, index) in form.questionList"
|
|
|
+ :label="'面试问题' + (index + 1)"
|
|
|
+ :key="index"
|
|
|
+ :prop="'questionList.' + index + '.questionName'"
|
|
|
+ :rules="{
|
|
|
+ required: true, message: '问题不能为空', trigger: 'blur'
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <div v-if="state!=2">
|
|
|
+ <div class="flex">
|
|
|
+ <el-input v-model.trim="item.questionName"></el-input>
|
|
|
+ <el-button type="danger" @click.prevent="index === 0 || removeDomain(item)">删除</el-button>
|
|
|
+ </div>
|
|
|
+ <el-select
|
|
|
+ v-model="item.videoIdList"
|
|
|
+ multiple
|
|
|
+ filterable
|
|
|
+ :disabled="state === 2"
|
|
|
+ default-first-option
|
|
|
+ placeholder="请选择面试视频">
|
|
|
+ <el-option
|
|
|
+ v-for="item in downList"
|
|
|
+ :key="item.key || item.id"
|
|
|
+ :label="item.videoName"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <div>
|
|
|
+ {{item.questionName}}
|
|
|
+ </div>
|
|
|
+ <video v-if="item.videoIdList && item.videoIdList.length" :src="downList.find(i => i.id === item.videoIdList[0]).videoPath" controls></video>
|
|
|
+ <div class="flex">
|
|
|
+ <div v-for="(i, j) in item.videoIdList" :key="j" @click="active = index" class="active===index ? 'is-active' : ''">{{downList.find(k => k.id === i).videoName}}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
- <el-button @click="dialogFormVisible = false">取 消</el-button>
|
|
|
- <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
|
|
|
+ <el-button @click="close">取 消</el-button>
|
|
|
+ <el-button @click="addDomain" type="success">新增</el-button>
|
|
|
+ <el-button type="primary" v-if="state!==2" @click="determine">确 定</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
@@ -39,50 +82,205 @@ export default {
|
|
|
return {
|
|
|
tableList: [],
|
|
|
dialogFormVisible: false,
|
|
|
- form: {},
|
|
|
page: 1,
|
|
|
- sortRule: {},
|
|
|
totalrecords: 0,
|
|
|
+ form: {
|
|
|
+ questionList: [
|
|
|
+ { key: 1 }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ state: 0,
|
|
|
+ active: 0,
|
|
|
+ downList: [],
|
|
|
pickList: [],
|
|
|
- list: [
|
|
|
- ],
|
|
|
+ list: [],
|
|
|
+ delId: [],
|
|
|
btn: [
|
|
|
{
|
|
|
- name: '添加新面试流程',
|
|
|
+ name: '添加',
|
|
|
type: 'success',
|
|
|
- method: ''
|
|
|
+ method: 'add'
|
|
|
}
|
|
|
],
|
|
|
table: {
|
|
|
column: [
|
|
|
{
|
|
|
label: '编号',
|
|
|
- props: ''
|
|
|
+ props: 'id'
|
|
|
},
|
|
|
{
|
|
|
label: '流程名称',
|
|
|
- props: ''
|
|
|
+ props: 'processName'
|
|
|
}
|
|
|
],
|
|
|
handle: [
|
|
|
{
|
|
|
title: '查看',
|
|
|
- method: '',
|
|
|
+ method: 'details',
|
|
|
type: 'info'
|
|
|
},
|
|
|
{
|
|
|
title: '编辑',
|
|
|
- method: '',
|
|
|
- type: 'info'
|
|
|
+ method: 'editor',
|
|
|
+ type: 'warning'
|
|
|
},
|
|
|
{
|
|
|
title: '删除',
|
|
|
- method: '',
|
|
|
- type: 'info'
|
|
|
+ method: 'del',
|
|
|
+ type: 'danger'
|
|
|
}
|
|
|
]
|
|
|
}
|
|
|
}
|
|
|
+ },
|
|
|
+ created () {
|
|
|
+ this.queryData()
|
|
|
+ this.queryDownList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ queryData (form = {}) {
|
|
|
+ let page = this.page
|
|
|
+ let reqdata = form
|
|
|
+ this.$api
|
|
|
+ .post('/process/queryProcessList', {
|
|
|
+ reqdata,
|
|
|
+ page
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ this.totalrecords = res.totalrecords
|
|
|
+ this.tableList = res.list
|
|
|
+ })
|
|
|
+ },
|
|
|
+ queryDownList () {
|
|
|
+ this.$api
|
|
|
+ .post('/video/queryVideoList', {
|
|
|
+ reqdata: {}
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ this.downList = res.list
|
|
|
+ })
|
|
|
+ },
|
|
|
+ add () {
|
|
|
+ this.open()
|
|
|
+ this.info = {}
|
|
|
+ this.state = 0
|
|
|
+ },
|
|
|
+ getDetails (row) {
|
|
|
+ let reqdata = { id: row.id }
|
|
|
+ this.$api
|
|
|
+ .post('/process/queryProcessDetail', {
|
|
|
+ reqdata
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ this.open()
|
|
|
+ this.form = res.object
|
|
|
+ })
|
|
|
+ },
|
|
|
+ details (row) {
|
|
|
+ this.getDetails(row)
|
|
|
+ this.state = 2
|
|
|
+ },
|
|
|
+ editor (row) {
|
|
|
+ this.getDetails(row)
|
|
|
+ this.state = 1
|
|
|
+ },
|
|
|
+ del (row) {
|
|
|
+ this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ let reqdata = { id: row.id }
|
|
|
+ this.$api
|
|
|
+ .post('/process/deleteProcess', {
|
|
|
+ reqdata
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ this.$message({
|
|
|
+ message: '删除成功',
|
|
|
+ type: 'success'
|
|
|
+ })
|
|
|
+ this.queryData()
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: '已取消删除'
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ determine () {
|
|
|
+ let a
|
|
|
+ this.$refs['form'].validate((valid) => {
|
|
|
+ a = valid
|
|
|
+ })
|
|
|
+ if (!a) return
|
|
|
+ let url = this.state ? '/process/updateProcess' : '/process/saveProcess'
|
|
|
+ let reqdata = JSON.parse(JSON.stringify(this.form))
|
|
|
+ if (this.state) {
|
|
|
+ reqdata.questionList.map(item => {
|
|
|
+ item.questionId = item.id
|
|
|
+ return item
|
|
|
+ })
|
|
|
+ this.delId.forEach(item => {
|
|
|
+ reqdata.questionList.push({ questionId: item })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.$api
|
|
|
+ .post(url, {
|
|
|
+ reqdata
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ this.close()
|
|
|
+ this.queryData()
|
|
|
+ this.delId = []
|
|
|
+ })
|
|
|
+ },
|
|
|
+ removeDomain (item) {
|
|
|
+ var index = this.form.questionList.indexOf(item)
|
|
|
+ if (index !== -1) {
|
|
|
+ this.delId.push(this.form.questionList[index].id)
|
|
|
+ this.form.questionList.splice(index, 1)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ open () {
|
|
|
+ this.dialogFormVisible = true
|
|
|
+ },
|
|
|
+ close () {
|
|
|
+ this.form = {
|
|
|
+ questionList: []
|
|
|
+ }
|
|
|
+ this.dialogFormVisible = false
|
|
|
+ },
|
|
|
+ addDomain () {
|
|
|
+ this.form.questionList.push({
|
|
|
+ key: Date.now()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ callPage (val) {
|
|
|
+ this.page = val
|
|
|
+ this.queryData()
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.dialog-footer {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.flex {
|
|
|
+ margin-bottom: 5px;
|
|
|
+ display: flex;
|
|
|
+ > div {
|
|
|
+ cursor: pointer;
|
|
|
+ color: rgb(42, 117, 216);
|
|
|
+ // margin: 10px;
|
|
|
+ }
|
|
|
+ .is-active {
|
|
|
+ color: #000;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|