parent
94a4d09404
commit
8e6765d921
@ -1,101 +1,101 @@ |
||||
<template> |
||||
<div class="component-upload-image"> |
||||
<el-upload |
||||
:action="uploadImgUrl" |
||||
list-type="picture-card" |
||||
:on-success="handleUploadSuccess" |
||||
:before-upload="handleBeforeUpload" |
||||
:on-error="handleUploadError" |
||||
name="file" |
||||
:show-file-list="false" |
||||
:headers="headers" |
||||
style="display: inline-block; vertical-align: top" |
||||
> |
||||
<el-image v-if="!value" :src="value"> |
||||
<div slot="error" class="image-slot"> |
||||
<i class="el-icon-plus" /> |
||||
</div> |
||||
</el-image> |
||||
<div v-else class="image"> |
||||
<el-image :src="base + value" :style="`width:150px;height:150px;`" fit="fill"/> |
||||
<div class="mask"> |
||||
<div class="actions"> |
||||
<span title="预览" @click.stop="dialogVisible = true"> |
||||
<i class="el-icon-zoom-in" /> |
||||
</span> |
||||
<span title="移除" @click.stop="removeImage"> |
||||
<i class="el-icon-delete" /> |
||||
</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</el-upload> |
||||
<el-dialog :visible.sync="dialogVisible" title="预览" width="800" append-to-body> |
||||
<img :src="value" style="display: block; max-width: 100%; margin: 0 auto;"> |
||||
</el-dialog> |
||||
</div> |
||||
<div class="component-upload-image"> |
||||
<el-upload |
||||
:action="uploadImgUrl" |
||||
list-type="picture-card" |
||||
:on-success="handleUploadSuccess" |
||||
:before-upload="handleBeforeUpload" |
||||
:on-error="handleUploadError" |
||||
name="file" |
||||
:show-file-list="false" |
||||
:headers="headers" |
||||
style="display: inline-block; vertical-align: top" |
||||
> |
||||
<el-image v-if="!value" :src="value"> |
||||
<div slot="error" class="image-slot"> |
||||
<i class="el-icon-plus" /> |
||||
</div> |
||||
</el-image> |
||||
<div v-else class="image"> |
||||
<el-image :src="base + value" :style="`width:150px;height:150px;`" fit="fill" /> |
||||
<div class="mask"> |
||||
<div class="actions"> |
||||
<span title="预览" @click.stop="dialogVisible = true"> |
||||
<i class="el-icon-zoom-in" style="color: #ffffff;margin-right:20px" /> |
||||
</span> |
||||
<span title="移除" @click.stop="removeImage"> |
||||
<i class="el-icon-delete" style="color: #ffffff" /> |
||||
</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</el-upload> |
||||
<el-dialog :visible.sync="dialogVisible" title="预览" width="800" append-to-body> |
||||
<img :src="value" style="display: block; max-width: 100%; margin: 0 auto" /> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import { getToken } from "@/utils/auth"; |
||||
import { getToken } from '@/utils/auth' |
||||
|
||||
export default { |
||||
data() { |
||||
return { |
||||
base: process.env.VUE_APP_BASE_API, |
||||
dialogVisible: false, |
||||
uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址 |
||||
headers: { |
||||
Authorization: "Bearer " + getToken(), |
||||
}, |
||||
}; |
||||
}, |
||||
props: { |
||||
value: { |
||||
type: String, |
||||
default: "", |
||||
data() { |
||||
return { |
||||
base: process.env.VUE_APP_BASE_API, |
||||
dialogVisible: false, |
||||
uploadImgUrl: process.env.VUE_APP_BASE_API + '/common/upload', // 上传的图片服务器地址 |
||||
headers: { |
||||
Authorization: 'Bearer ' + getToken(), |
||||
}, |
||||
} |
||||
}, |
||||
}, |
||||
methods: { |
||||
removeImage() { |
||||
this.$emit("input", ""); |
||||
props: { |
||||
value: { |
||||
type: String, |
||||
default: '', |
||||
}, |
||||
}, |
||||
handleUploadSuccess(res) { |
||||
this.$emit("input", res.fileName); |
||||
this.loading.close(); |
||||
methods: { |
||||
removeImage() { |
||||
this.$emit('input', '') |
||||
}, |
||||
handleUploadSuccess(res) { |
||||
this.$emit('input', res.fileName) |
||||
this.loading.close() |
||||
}, |
||||
handleBeforeUpload() { |
||||
this.loading = this.$loading({ |
||||
lock: true, |
||||
text: '上传中', |
||||
background: 'rgba(0, 0, 0, 0.7)', |
||||
}) |
||||
}, |
||||
handleUploadError() { |
||||
this.$message({ |
||||
type: 'error', |
||||
message: '上传失败', |
||||
}) |
||||
this.loading.close() |
||||
}, |
||||
}, |
||||
handleBeforeUpload() { |
||||
this.loading = this.$loading({ |
||||
lock: true, |
||||
text: "上传中", |
||||
background: "rgba(0, 0, 0, 0.7)", |
||||
}); |
||||
}, |
||||
handleUploadError() { |
||||
this.$message({ |
||||
type: "error", |
||||
message: "上传失败", |
||||
}); |
||||
this.loading.close(); |
||||
}, |
||||
}, |
||||
watch: {}, |
||||
}; |
||||
watch: {}, |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.image { |
||||
position: relative; |
||||
.mask { |
||||
opacity: 0; |
||||
position: absolute; |
||||
top: 0; |
||||
width: 100%; |
||||
background-color: rgba(0, 0, 0, 0.5); |
||||
transition: all 0.3s; |
||||
} |
||||
&:hover .mask { |
||||
opacity: 1; |
||||
} |
||||
position: relative; |
||||
.mask { |
||||
opacity: 0; |
||||
position: absolute; |
||||
top: 0; |
||||
width: 100%; |
||||
background-color: rgba(0, 0, 0, 0.5); |
||||
transition: all 0.3s; |
||||
} |
||||
&:hover .mask { |
||||
opacity: 1; |
||||
} |
||||
} |
||||
</style> |
File diff suppressed because it is too large
Load Diff
@ -1,15 +0,0 @@ |
||||
<template> |
||||
<div> |
||||
可靠性 |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
|
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
|
||||
</style> |
@ -0,0 +1,180 @@ |
||||
<template> |
||||
<div class="container" style="padding: 30px"> |
||||
<el-form |
||||
:model="queryParams" |
||||
ref="queryForm" |
||||
:inline="true" |
||||
label-width="68px" |
||||
style="display: flex; justify-content: space-between" |
||||
> |
||||
<!-- <div style="display: flex"> |
||||
<el-form-item label="学校名称" prop="title"> |
||||
<el-input v-model="queryParams.title" placeholder="请输入资讯标题" clearable size="small" /> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> |
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> |
||||
</el-form-item> |
||||
</div> --> |
||||
<div style="margin-top: 5px;margin-bottom: 10px"> |
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="addsign">新增</el-button> |
||||
<el-button type="warning" icon="el-icon-plus" size="mini">导入</el-button> |
||||
</div> |
||||
</el-form> |
||||
<el-table v-loading="loading" :data="schoolList"> |
||||
<el-table-column label="序号" align="center" type="index" /> |
||||
<el-table-column label="姓名" align="center" prop="schoolName" /> |
||||
<el-table-column label="手机号" align="center" prop="schoolName" /> |
||||
<el-table-column label="证书编号" align="center" prop="schoolName" /> |
||||
<el-table-column label="学校" align="center" prop="schoolName" /> |
||||
<el-table-column label="二级学院" align="center" prop="schoolName" /> |
||||
<el-table-column label="备注" align="center" prop="schoolName" /> |
||||
<el-table-column label="操作" align="center"> |
||||
<template slot-scope="scope"> |
||||
<el-button size="mini" type="text" @click="modify(scope.row)">修改</el-button> |
||||
<el-button size="mini" type="text" @click="delrow(scope.row)">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<pagination |
||||
v-show="total > 0" |
||||
:total="total" |
||||
:page.sync="queryParams.pageNum" |
||||
:limit.sync="queryParams.pageSize" |
||||
@pagination="getList" |
||||
/> |
||||
<el-dialog |
||||
class="diaform" |
||||
:title="title" |
||||
:visible.sync="visibleopen" |
||||
:close-on-click-modal="false" |
||||
width="700px" |
||||
append-to-body |
||||
@close="colsedia" |
||||
> |
||||
<el-form :model="form" :rules="rules" ref="form" label-width="70px"> |
||||
<el-form-item label="姓名" prop="schoolName"> |
||||
<el-input v-model="form.schoolName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="手机号" prop="schoolName"> |
||||
<el-input v-model="form.schoolName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="证书编号" prop="schoolName"> |
||||
<el-input v-model="form.schoolName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="学校" prop="schoolName"> |
||||
<el-input v-model="form.schoolName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="二级学院" prop="schoolName"> |
||||
<el-input v-model="form.schoolName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="备注" prop="schoolName"> |
||||
<el-input v-model="form.schoolName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item style="margin-top: 80px; text-align: center; margin-left: -150px"> |
||||
<el-button |
||||
type="primary" |
||||
style="width: 135px; font-size: 16px; height: 39px; line-height: 11px" |
||||
@click="submitto('confirm')" |
||||
>确认</el-button |
||||
> |
||||
<el-button |
||||
style="width: 135px; font-size: 16px; height: 39px; line-height: 11px; margin-left: 30px" |
||||
@click="colsedia" |
||||
>取消</el-button |
||||
> |
||||
</el-form-item> |
||||
</el-form> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
import { getSchoolList, addSchool, updateSchool, delSchool } from '@/api/trainService/index.js' |
||||
import ImageUpload from '@/components/ImgUpload/index.vue' |
||||
export default { |
||||
name: 'peixunbaoming', |
||||
components: { ImageUpload }, |
||||
data() { |
||||
return { |
||||
imgAction: process.env.VUE_APP_BASE_API + '/upload', |
||||
loading: false, |
||||
schoolList: [], |
||||
// 总条数 |
||||
total: 0, |
||||
// 查询参数 |
||||
queryParams: { |
||||
pageNum: 1, |
||||
pageSize: 10, |
||||
}, |
||||
title: '新增教师', |
||||
visibleopen: false, |
||||
form: {}, |
||||
rules: {}, |
||||
} |
||||
}, |
||||
|
||||
mounted() {}, |
||||
methods: { |
||||
async getList() { |
||||
const res = await getSchoolList(this.queryParams) |
||||
this.total = res.total |
||||
this.schoolList = res.rows |
||||
}, |
||||
//新增资讯的弹窗 |
||||
addsign() { |
||||
this.title = '新增教师' |
||||
this.visibleopen = true |
||||
}, |
||||
//修改资讯的弹窗 |
||||
async modify(row) { |
||||
this.title = '修改教师' |
||||
this.visibleopen = true |
||||
this.form = row |
||||
}, |
||||
async delrow(row) { |
||||
this.$confirm('是否确认删除教师', '警告', { |
||||
confirmButtonText: '确定', |
||||
cancelButtonText: '取消', |
||||
type: 'warning', |
||||
}) |
||||
.then(function () { |
||||
return delSchool(row.schoolId) |
||||
}) |
||||
.then(() => { |
||||
this.getList() |
||||
this.$message.success('删除成功') |
||||
}) |
||||
}, |
||||
// 提交 |
||||
async submitto() { |
||||
if (this.form.schoolId) { |
||||
// 修改 |
||||
await updateSchool(this.form) |
||||
this.$message.success('修改成功') |
||||
} else { |
||||
await addSchool(this.form) |
||||
this.$message.success('新增成功') |
||||
} |
||||
this.colsedia() |
||||
this.getList() |
||||
}, |
||||
// 关闭 |
||||
colsedia() { |
||||
this.visibleopen = false |
||||
}, |
||||
handleQuery() { |
||||
this.getList() |
||||
}, |
||||
resetQuery() { |
||||
this.resetForm('queryForm') |
||||
this.getList() |
||||
}, |
||||
}, |
||||
created() { |
||||
this.getList() |
||||
}, |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
</style> |
@ -0,0 +1,187 @@ |
||||
<template> |
||||
<div class="container" style="padding: 30px"> |
||||
<el-form |
||||
:model="queryParams" |
||||
ref="queryForm" |
||||
:inline="true" |
||||
label-width="68px" |
||||
style="display: flex; justify-content: space-between" |
||||
> |
||||
<!-- <div style="display: flex"> |
||||
<el-form-item label="学校名称" prop="title"> |
||||
<el-input v-model="queryParams.title" placeholder="请输入资讯标题" clearable size="small" /> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> |
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> |
||||
</el-form-item> |
||||
</div> --> |
||||
<div style="margin-top: 5px"> |
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="addsign">新增</el-button> |
||||
</div> |
||||
</el-form> |
||||
<el-table v-loading="loading" :data="schoolList"> |
||||
<el-table-column label="序号" align="center" type="index" /> |
||||
<el-table-column label="姓名" align="center" prop="schoolName" /> |
||||
<el-table-column label="手机号" align="center" prop="schoolName" /> |
||||
<el-table-column label="教学方向" align="center" prop="schoolName" /> |
||||
<el-table-column label="职称" align="center" prop="schoolName" /> |
||||
<el-table-column label="简介" align="center" prop="schoolName" /> |
||||
<el-table-column label="操作" align="center"> |
||||
<template slot-scope="scope"> |
||||
<el-button size="mini" type="text" @click="modify(scope.row)">修改</el-button> |
||||
<el-button size="mini" type="text" @click="delrow(scope.row)">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<pagination |
||||
v-show="total > 0" |
||||
:total="total" |
||||
:page.sync="queryParams.pageNum" |
||||
:limit.sync="queryParams.pageSize" |
||||
@pagination="getList" |
||||
/> |
||||
<el-dialog |
||||
class="diaform" |
||||
:title="title" |
||||
:visible.sync="visibleopen" |
||||
:close-on-click-modal="false" |
||||
width="700px" |
||||
append-to-body |
||||
@close="colsedia" |
||||
> |
||||
<el-form :model="form" :rules="rules" ref="form" label-width="70px"> |
||||
<el-form-item label="姓名" prop="schoolName"> |
||||
<el-input v-model="form.schoolName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="手机号" prop="schoolName"> |
||||
<el-input v-model="form.schoolName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="教学方向" prop="schoolName"> |
||||
<el-input v-model="form.schoolName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="职称" prop="schoolName"> |
||||
<el-input v-model="form.schoolName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="简介" prop="schoolName"> |
||||
<el-input v-model="form.schoolName" type="textarea" :rows="6"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="图片"> |
||||
<ImageUpload |
||||
ref="imgupload" |
||||
v-model="form.c" |
||||
listtype="picture-card" |
||||
fileName="publicize" |
||||
:limit="1" |
||||
/> |
||||
</el-form-item> |
||||
|
||||
<el-form-item style="margin-top: 80px; text-align: center; margin-left: -150px"> |
||||
<el-button |
||||
type="primary" |
||||
style="width: 135px; font-size: 16px; height: 39px; line-height: 11px" |
||||
@click="submitto('confirm')" |
||||
>确认</el-button |
||||
> |
||||
<el-button |
||||
style="width: 135px; font-size: 16px; height: 39px; line-height: 11px; margin-left: 30px" |
||||
@click="colsedia" |
||||
>取消</el-button |
||||
> |
||||
</el-form-item> |
||||
</el-form> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
import { getSchoolList, addSchool, updateSchool, delSchool } from '@/api/trainService/index.js' |
||||
import ImageUpload from '@/components/ImageUpload/index.vue' |
||||
export default { |
||||
name: 'peixunbaoming', |
||||
components: { ImageUpload }, |
||||
data() { |
||||
return { |
||||
imgAction: process.env.VUE_APP_BASE_API + '/upload', |
||||
loading: false, |
||||
schoolList: [], |
||||
// 总条数 |
||||
total: 0, |
||||
// 查询参数 |
||||
queryParams: { |
||||
pageNum: 1, |
||||
pageSize: 10, |
||||
}, |
||||
title: '新增教师', |
||||
visibleopen: false, |
||||
form: { |
||||
c: 'http://192.168.0.229:9999/profile/upload/2024/05/21/13b358f9-8fbb-4f3e-839e-6595d33247db.png' |
||||
}, |
||||
rules: {}, |
||||
} |
||||
}, |
||||
|
||||
mounted() {}, |
||||
methods: { |
||||
async getList() { |
||||
const res = await getSchoolList(this.queryParams) |
||||
this.total = res.total |
||||
this.schoolList = res.rows |
||||
}, |
||||
//新增资讯的弹窗 |
||||
addsign() { |
||||
this.title = '新增教师' |
||||
this.visibleopen = true |
||||
}, |
||||
//修改资讯的弹窗 |
||||
async modify(row) { |
||||
this.title = '修改教师' |
||||
this.visibleopen = true |
||||
this.form = row |
||||
}, |
||||
async delrow(row) { |
||||
this.$confirm('是否确认删除教师', '警告', { |
||||
confirmButtonText: '确定', |
||||
cancelButtonText: '取消', |
||||
type: 'warning', |
||||
}) |
||||
.then(function () { |
||||
return delSchool(row.schoolId) |
||||
}) |
||||
.then(() => { |
||||
this.getList() |
||||
this.$message.success('删除成功') |
||||
}) |
||||
}, |
||||
// 提交 |
||||
async submitto() { |
||||
if (this.form.schoolId) { |
||||
// 修改 |
||||
await updateSchool(this.form) |
||||
this.$message.success('修改成功') |
||||
} else { |
||||
await addSchool(this.form) |
||||
this.$message.success('新增成功') |
||||
} |
||||
this.colsedia() |
||||
this.getList() |
||||
}, |
||||
// 关闭 |
||||
colsedia() { |
||||
this.visibleopen = false |
||||
}, |
||||
handleQuery() { |
||||
this.getList() |
||||
}, |
||||
resetQuery() { |
||||
this.resetForm('queryForm') |
||||
this.getList() |
||||
}, |
||||
}, |
||||
created() { |
||||
this.getList() |
||||
}, |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
</style> |
@ -1,15 +0,0 @@ |
||||
<template> |
||||
<div> |
||||
线下 |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
|
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
|
||||
</style> |
Loading…
Reference in new issue