297 lines
7.1 KiB
Vue
297 lines
7.1 KiB
Vue
<template>
|
|
<el-container>
|
|
<el-header>
|
|
<div class="left-panel">
|
|
<el-button
|
|
type="primary"
|
|
icon="el-icon-plus"
|
|
@click="table_add"
|
|
v-auth="'train.create'"
|
|
></el-button>
|
|
</div>
|
|
<div class="right-panel">
|
|
<el-input
|
|
style="margin-right: 5px"
|
|
v-model="query.search"
|
|
placeholder="名称"
|
|
clearable
|
|
></el-input>
|
|
<el-button
|
|
type="primary"
|
|
icon="el-icon-search"
|
|
@click="handleQuery"
|
|
></el-button>
|
|
</div>
|
|
</el-header>
|
|
<el-main class="nopadding">
|
|
<scTable
|
|
ref="table"
|
|
:apiObj="apiObj"
|
|
row-key="id"
|
|
:query="query"
|
|
>
|
|
<el-table-column
|
|
label="培训名称"
|
|
prop="name"
|
|
></el-table-column>
|
|
<el-table-column label="等级">
|
|
<template v-slot="scope">
|
|
<div v-for="(item, index) in levelOptions" :key="index">
|
|
<span v-if="item.value == scope.row.level">{{ item.key }}</span>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
label="时长(h)"
|
|
prop="duration"
|
|
width="80"
|
|
></el-table-column>
|
|
<el-table-column
|
|
label="开始时间"
|
|
prop="start_time"
|
|
></el-table-column>
|
|
<el-table-column
|
|
label="结束时间"
|
|
prop="end_time"
|
|
></el-table-column>
|
|
<el-table-column
|
|
label="地点"
|
|
prop="place"
|
|
></el-table-column>
|
|
<el-table-column
|
|
label="是否公开"
|
|
width="80"
|
|
>
|
|
<template #default="scope">
|
|
<el-tag v-if="scope.row.is_public" type="success">是</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
label="操作"
|
|
fixed="right"
|
|
align="center"
|
|
width="150"
|
|
>
|
|
<template #default="scope">
|
|
<el-button
|
|
link
|
|
size="small"
|
|
@click="table_edit(scope.row)"
|
|
v-auth="'train.update'"
|
|
type="primary"
|
|
>编辑</el-button
|
|
>
|
|
<!-- <el-button
|
|
link
|
|
size="small"
|
|
@click="row_detail(scope.row)"
|
|
type="primary"
|
|
>详情</el-button
|
|
> -->
|
|
<el-popconfirm
|
|
title="确定删除吗？"
|
|
@confirm="table_del(scope.row, scope.$index)"
|
|
>
|
|
<template #reference>
|
|
<el-button
|
|
link
|
|
size="small"
|
|
v-auth="'train.delete'"
|
|
type="danger"
|
|
>删除</el-button
|
|
>
|
|
</template>
|
|
</el-popconfirm>
|
|
</template>
|
|
</el-table-column>
|
|
</scTable>
|
|
</el-main>
|
|
<el-dialog v-model="trainDialog" title="新增培训记录">
|
|
<el-form
|
|
:model="trainForm"
|
|
label-width="100px"
|
|
ref="questioncatForm"
|
|
>
|
|
<el-row>
|
|
<el-col :span="18">
|
|
<el-form-item label="培训名称" prop="name" required>
|
|
<el-input
|
|
v-model="trainForm.name"
|
|
style="width: 100%;"
|
|
></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item label="级别" prop="level" required>
|
|
<el-select
|
|
v-model="trainForm.level"
|
|
filterable
|
|
reserve-keyword
|
|
style="width: 100%"
|
|
>
|
|
<el-option
|
|
v-for="item in levelOptions"
|
|
:key="item.key"
|
|
:label="item.key"
|
|
:value="item.value"
|
|
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="开始时间" prop="start_time" required>
|
|
<el-date-picker
|
|
v-model="trainForm.start_time"
|
|
type="datetime"
|
|
style="width:100%"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="结束时间" prop="end_time">
|
|
<el-date-picker
|
|
v-model="trainForm.end_time"
|
|
type="datetime"
|
|
style="width:100%"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="地点" prop="place" required>
|
|
<el-input
|
|
v-model="trainForm.place"
|
|
clearable
|
|
></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item label="时长(h)" prop="duration" required>
|
|
<el-input-number
|
|
v-model="trainForm.duration"
|
|
controls-position="right"
|
|
:step="0.5"
|
|
step-strictly="true"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item
|
|
label="是否公开"
|
|
prop="is_public"
|
|
required
|
|
>
|
|
<el-switch v-model="trainForm.is_public"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="内容描述" prop="description" required>
|
|
<el-input
|
|
v-model="trainForm.description"
|
|
clearable
|
|
autisize
|
|
type="textarea"
|
|
></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-form-item label="附件" prop="files">
|
|
<sc-upload-file
|
|
:multiple="false"
|
|
:on-success="handleUpSuccess"
|
|
:limit="1"
|
|
tip="最多上传10个文件,单个文件不要超过10M"
|
|
>
|
|
<el-button type="primary" icon="el-icon-upload"> </el-button>
|
|
</sc-upload-file>
|
|
</el-form-item>
|
|
</el-row>
|
|
</el-form>
|
|
<template #footer>
|
|
<el-button
|
|
type="primary"
|
|
:loading="trainSaving"
|
|
@click="TrainSubmit()"
|
|
>保 存</el-button
|
|
>
|
|
</template>
|
|
</el-dialog>
|
|
</el-container>
|
|
</template>
|
|
<script>
|
|
const defaultTrain = {chance: 1, is_public:false}
|
|
export default {
|
|
data() {
|
|
return {
|
|
paperOptions:[],
|
|
trainDialog: false,
|
|
apiObj: this.$API.edu.training.list,
|
|
query: {
|
|
search: "",
|
|
},
|
|
levelOptions:[
|
|
{key:'岗位',value:10},
|
|
{key:'班组',value:20},
|
|
{key:'部门',value:30},
|
|
{key:'公司',value:40}
|
|
],
|
|
trainForm: Object.assign({}, defaultTrain),
|
|
};
|
|
},
|
|
mounted() {
|
|
this.getPaperOptions();
|
|
},
|
|
methods: {
|
|
getPaperOptions() {
|
|
this.$API.edu.training.list.req({
|
|
page: 0
|
|
}).then(res => {
|
|
this.paperOptions = res;
|
|
});
|
|
},
|
|
handleQuery() {
|
|
this.$refs.table.queryData(this.query);
|
|
},
|
|
table_add() {
|
|
this.trainForm = Object.assign({}, defaultTrain);
|
|
this.trainDialog = true;
|
|
},
|
|
table_edit(row) {
|
|
this.trainForm = Object.assign({}, row);
|
|
this.trainDialog = true;
|
|
},
|
|
table_del(row) {
|
|
this.$API.edu.training.delete.req(row.id).then(() => {
|
|
this.handleQuery();
|
|
});
|
|
},
|
|
handleUpSuccess(res, file){
|
|
this.trainForm.files = [];
|
|
this.trainForm.files.push(res.id)
|
|
},
|
|
TrainSubmit() {
|
|
this.trainSaving = true;
|
|
if (this.trainForm.id){
|
|
this.$API.edu.training.update.req(this.trainForm.id, this.trainForm).then(res=>{
|
|
this.$message.success("更新成功");
|
|
this.trainSaving = false;
|
|
this.trainDialog = false;
|
|
this.handleQuery();
|
|
}).catch(e=>{this.trainSaving=false})
|
|
}else{
|
|
console.log(this.trainForm)
|
|
this.$API.edu.training.create.req(this.trainForm).then(res=>{
|
|
this.$message.success("创建成功");
|
|
this.trainSaving = false;
|
|
this.trainDialog = false;
|
|
this.handleQuery();
|
|
}).catch(err=>{
|
|
this.trainSaving = false;
|
|
})
|
|
}
|
|
|
|
}
|
|
},
|
|
};
|
|
</script>
|