新增证书方案及课程列表

This commit is contained in:
shijing 2024-01-02 17:33:53 +08:00
parent 4628111076
commit 2c8b6d26f0
5 changed files with 373 additions and 23 deletions

File diff suppressed because one or more lines are too long

View File

@ -40,4 +40,43 @@ export function createCertificate(data) {
url: `/edu/certificate/${id}/`, url: `/edu/certificate/${id}/`,
method: 'get' method: 'get'
}) })
}
//课程
export function getCourseList(query) {
return request({
url: '/edu/course/',
method: 'get',
params: query
})
}
export function createCourse(data) {
return request({
url: '/edu/course/',
method: 'post',
data
})
}
export function updateCourse(id, data) {
return request({
url: `/edu/course/${id}/`,
method: 'put',
data
})
}
export function deleteCourse(id) {
return request({
url: `/edu/course/${id}/`,
method: 'delete'
})
}
export function getCourse(id) {
return request({
url: `/edu/course/${id}/`,
method: 'get'
})
} }

View File

@ -452,6 +452,12 @@ export const asyncRoutes = [
meta: { title: '视频播放统计', perms: ['video_view'] }, meta: { title: '视频播放统计', perms: ['video_view'] },
// hidden: true // hidden: true
}, },
{
path: 'course',
name: 'course',
component: () => import('@/views/testvideo/course.vue'),
meta: { title: '课程列表'}
},
] ]
}, },
{ {

View File

@ -2,6 +2,9 @@
<div class="app-container"> <div class="app-container">
<el-card> <el-card>
<div> <div>
<el-select v-model="listQuery.证书方案" @change="planChange" placeholder="证书方案">
<el-option v-for="item in planOption" :key="item" :label="item" :value="item"></el-option>
</el-select>
<el-input <el-input
v-model="listQuery.search" v-model="listQuery.search"
placeholder="姓名/证书号/单位" placeholder="姓名/证书号/单位"
@ -63,30 +66,43 @@
type="selection" type="selection"
width="55"> width="55">
</el-table-column> </el-table-column>
<el-table-column type="index" width="50" /> <!-- <el-table-column type="index" width="50" /> -->
<el-table-column label="所属单位" prop="所属单位"> <el-table-column label="证书方案" prop="证书方案">
</el-table-column>
<el-table-column label="所属单位" prop="所属单位" v-if="listQuery.证书方案=='202309'">
</el-table-column> </el-table-column>
<el-table-column label="姓名" prop="姓名"> <el-table-column label="姓名" prop="姓名">
</el-table-column> </el-table-column>
<el-table-column label="证书编号" prop="证书编号"> <el-table-column label="证书编号" prop="证书编号">
</el-table-column>内审员 </el-table-column>
<el-table-column label="职务" prop="职务"> <template v-if="listQuery.证书方案=='202309'">
</el-table-column>
<el-table-column label="资格"> <el-table-column label="职务" prop="职务">
<template slot-scope="scope"> </el-table-column>
<span v-if="scope.row.是否内审员">内审员 </span> <el-table-column label="资格">
<span v-if="scope.row.是否授权签字人">授权签字人 </span> <template slot-scope="scope">
<span v-if="scope.row.是否最高管理者">最高管理者 </span> <span v-if="scope.row.是否内审员">内审员 </span>
<span v-if="scope.row.是否质量负责人">质量负责人</span> <span v-if="scope.row.是否授权签字人">授权签字人 </span>
</template> <span v-if="scope.row.是否最高管理者">最高管理者 </span>
</el-table-column> <span v-if="scope.row.是否质量负责人">质量负责人</span>
</template>
</el-table-column>
</template>
<template v-if="listQuery.证书方案=='202312'">
<el-table-column label="培训日期" prop="培训日期">
</el-table-column>
<el-table-column label="培训结束日期" prop="培训结束日期">
</el-table-column>
<el-table-column label="发证日期" prop="发证日期">
</el-table-column>
</template>
<el-table-column label="创建日期"> <el-table-column label="创建日期">
<template slot-scope="scope">{{scope.row.create_time.substring(0, 10)}}</template> <template slot-scope="scope">{{scope.row.create_time.substring(0, 10)}}</template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="操作"> <el-table-column align="center" label="操作">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="success" size="small" @click="handleShow(scope.row)" icon="el-icon-picture"></el-button> <el-button type="success" size="small" @click="handleShow(scope.row)" icon="el-icon-picture"></el-button>
<el-button type="primary" size="small" @click="handleEdit(scope)" icon="el-icon-edit" <el-button type="primary" size="small" @click="handleEdit(scope.row)" icon="el-icon-edit"
:disabled="!checkPermission(['certificate'])"></el-button> :disabled="!checkPermission(['certificate'])"></el-button>
<el-button type="danger" size="small" @click="handleDelete(scope)" icon="el-icon-delete" <el-button type="danger" size="small" @click="handleDelete(scope)" icon="el-icon-delete"
:disabled="!checkPermission(['certificate'])"></el-button> :disabled="!checkPermission(['certificate'])"></el-button>
@ -113,6 +129,69 @@
:rules="rule" :rules="rule"
> >
<el-row> <el-row>
<el-col :span="12">
<el-form-item label="证书方案">
<el-select style="width: 100%" v-model="form.证书方案" placeholder="证书方案">
<el-option v-for="item in planOption" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="证书编号" prop="证书编号">
<el-input v-model="form.证书编号" />
</el-form-item>
</el-col>
</el-row>
<el-row v-if="form.证书方案=='202312'">
<el-col :span="12">
<el-form-item label="姓名">
<el-input v-model="form.姓名" />
</el-form-item>
<el-form-item label="培训开始日期" prop="培训日期">
<el-date-picker
v-model="form.培训日期"
type="date"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
placeholder="培训日期"
style="width:100%">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="发证日期" prop="发证日期">
<el-date-picker
v-model="form.发证日期"
type="date"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
placeholder="发证日期"
style="width:100%">
</el-date-picker>
</el-form-item>
<el-form-item label="培训结束日期" prop="培训结束日期">
<el-date-picker
v-model="form.培训结束日期"
type="date"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
placeholder="培训结束日期"
style="width:100%">
</el-date-picker>
</el-form-item>
</el-col>
<el-col>
<el-form-item label="课程列表">
<el-select style="width: 100%" v-model="form.课程列表" clearable multiple placeholder="课程列表">
<el-option v-for="item in courseOption"
:key="item.id" :label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row v-if="form.证书方案=='202309'">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="姓名"> <el-form-item label="姓名">
<el-input v-model="form.姓名" /> <el-input v-model="form.姓名" />
@ -137,9 +216,6 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="证书编号" prop="证书编号">
<el-input v-model="form.证书编号" />
</el-form-item>
<el-form-item label="所属单位" prop="所属单位"> <el-form-item label="所属单位" prop="所属单位">
<el-input v-model="form.所属单位"/> <el-input v-model="form.所属单位"/>
</el-form-item> </el-form-item>
@ -197,7 +273,7 @@
} }
</style> </style>
<script> <script>
import {getCertificateList,createCertificate,updateCertificate,impCertificate,deleteCertificate,getCertificate} from "@/api/edu"; import {getCertificateList,createCertificate,updateCertificate,impCertificate,deleteCertificate,getCertificate,getCourseList} from "@/api/edu";
import checkPermission from "@/utils/permission"; import checkPermission from "@/utils/permission";
import { upUrl, upHeaders } from "@/api/file"; import { upUrl, upHeaders } from "@/api/file";
import Pagination from "@/components/Pagination"; // secondary package based on el-pagination import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
@ -209,7 +285,12 @@ const dflistForm = {
"单位名称": "", "单位名称": "",
"职务": "", "职务": "",
"手机号": "", "手机号": "",
"发证日期":"",
"培训日期":"",
"课程列表":[],
"培训结束日期":"",
"字体方案":'1', "字体方案":'1',
"证书方案":"202312",
"是否内审员": false, "是否内审员": false,
"是否授权签字人": false, "是否授权签字人": false,
"是否质量负责人": false, "是否质量负责人": false,
@ -220,7 +301,9 @@ const dflistForm = {
const dflistQuery = { const dflistQuery = {
page: 1, page: 1,
search:'', search:'',
证书方案:'202312',
page_size: 20, page_size: 20,
}; };
export default { export default {
components: { Pagination }, components: { Pagination },
@ -250,10 +333,13 @@ export default {
所属单位: [{ required: true, message: "请填写", trigger: "blur" }], 所属单位: [{ required: true, message: "请填写", trigger: "blur" }],
单位名称: [{ required: true, message: "请填写", trigger: "blur" }], 单位名称: [{ required: true, message: "请填写", trigger: "blur" }],
}, },
courseOption:[],
planOption:["202309","202312"],
}; };
}, },
mounted() { mounted() {
this.getList(); this.getList();
this.getCourseList();
}, },
methods: { methods: {
checkPermission, checkPermission,
@ -282,21 +368,34 @@ export default {
this.listLoading = false; this.listLoading = false;
}); });
}, },
planChange(){
this.getList();
},
//获取课程列表
getCourseList() {
getCourseList({page:0}).then((res) => {
if (res) {
this.courseOption = res.data;
}
});
},
handleFilter() { handleFilter() {
this.listQuery.page = 1; this.listQuery.page = 1;
this.getList(); this.getList();
}, },
handleAdd() { handleAdd() {
this.cma = Object.assign({}, dflistForm); this.form = Object.assign({}, dflistForm);
if(this.listQuery.证书方案!==''){
this.form.证书方案 = this.listQuery.证书方案;
}else{this.form.证书方案 = '202312'}
this.dialogType = "new"; this.dialogType = "new";
this.dialogVisible = true; this.dialogVisible = true;
this.$nextTick(() => { this.$nextTick(() => {
this.$refs["Form"].clearValidate(); this.$refs["Form"].clearValidate();
}); });
}, },
handleEdit(scope) { handleEdit(row) {
this.form = Object.assign({}, scope.row); // copy obj this.form = Object.assign({}, row); // copy obj
this.dialogType = "edit"; this.dialogType = "edit";
this.dialogVisible = true; this.dialogVisible = true;
this.$nextTick(() => { this.$nextTick(() => {

View File

@ -0,0 +1,206 @@
<template>
<div class="app-container">
<el-card>
<div style="margin-top: 6px">
<el-button type="primary" icon="el-icon-plus" @click="handleAdd" v-if="checkPermission(['course'])"
>新增课程</el-button>
</div>
</el-card>
<el-card style="margin-top: 10px">
<el-table
v-loading="listLoading"
:data="tableList.results"
style="width: 100%;"
border
fit
stripe
highlight-current-row
max-height="700"
ref="filterTable"
>
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column type="index" width="50" />
<el-table-column label="课程名称" prop="name">
</el-table-column>
<el-table-column label="创建日期">
<template slot-scope="scope">{{scope.row.create_time.substring(0, 10)}}</template>
</el-table-column>
<el-table-column align="center" label="操作">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="handleEdit(scope.row)" icon="el-icon-edit"
:disabled="!checkPermission(['course'])"></el-button>
<el-button type="danger" size="small" @click="handleDelete(scope)" icon="el-icon-delete"
:disabled="!checkPermission(['course'])"></el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="tableList.count > 0"
:total="tableList.count"
:page.sync="listQuery.page"
:limit.sync="listQuery.page_size"
@pagination="getList"
/>
</el-card>
<el-dialog
:visible.sync="dialogVisible"
:title="dialogType === 'edit' ? '编辑课程' : '新增课程'"
>
<el-form
ref="Form"
:model="form"
label-width="100px"
label-position="right"
:rules="rule"
>
<el-form-item label="课程名称" prop="name">
<el-input v-model="form.name" />
</el-form-item>
</el-form>
<div style="text-align: right">
<el-button type="danger" @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="confirm('Form')">确认</el-button>
</div>
</el-dialog>
</div>
</template>
<style >
.el-table-filter {
width: 400px;
max-height: 300px;
overflow-y: auto;
}
</style>
<script>
import {getCourseList,createCourse,updateCourse,deleteCourse} from "@/api/edu";
import checkPermission from "@/utils/permission";
import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
export default {
components: { Pagination },
data() {
return {
tableList: { count: 0 ,list:[] },
listLoading: true,
listQuery: {
page: 1,
page_size: 20,
},
form: {name:''},
dialogShow:false,
dialogVisible: false,
dialogType: "new",
popovervisible: false,
rule: {
name: [{ required: true, message: "请填写课程名称", trigger: "blur" }],
},
};
},
mounted() {
this.getList();
},
methods: {
checkPermission,
getList() {
this.listLoading = true;
getCourseList(this.listQuery).then((response) => {
if (response.data) {
this.tableList = response.data;
}
this.listLoading = false;
});
},
handleFilter() {
this.listQuery.page = 1;
this.getList();
},
handleAdd() {
this.form = { name: "" };
this.dialogType = "new";
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs["Form"].clearValidate();
});
},
handleEdit(row) {
this.form = Object.assign({}, row); // copy obj
this.dialogType = "edit";
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs["Form"].clearValidate();
});
},
handleDelete(scope) {
this.$confirm("确认删除?", "警告", {
confirmButtonText: "确认",
cancelButtonText: "取消",
type: "error",
})
.then(async () => {
await deleteCourse(scope.row.id);
this.getList();
this.$message({
type: "success",
message: "成功删除!",
});
})
.catch((err) => {
});
},
async confirm(form) {
this.$refs[form].validate((valid) => {
if (valid) {
const isEdit = this.dialogType === "edit";
if (isEdit) {
updateCourse(this.form.id, this.form).then((res) => {
if (res.code >= 200) {
this.getList();
this.dialogVisible = false;
this.$notify({
title: "成功",
message: "编辑成功",
type: "success",
duration: 2000,
});
}
});
} else {
createCourse(this.form).then((res) => {
if (res.code >= 200) {
this.getList();
this.dialogVisible = false;
this.$notify({
title: "成功",
message: "新增成功",
type: "success",
duration: 2000,
});
}
});
}
} else {
return false;
}
});
},
handleShow(row){
let timer = new Date().getTime();
if(row.证书地址!==null){
this.imgurl = 'https://testsearch.ctc.ac.cn'+row.证书地址+'?'+timer;
this.srcList.push(this.imgurl);
}else{
getCertificate(row.id).then(res=>{
this.imgurl='https://testsearch.ctc.ac.cn'+res.data.证书地址+'?'+timer;
this.srcList.push(this.imgurl);
})
}
this.dialogShow = true;
},
},
};
</script>