幼儿档案添加预览和打印

This commit is contained in:
sk1551 2021-01-27 11:35:56 +08:00
parent 18cab18fbe
commit 2236b55dd1
5 changed files with 556 additions and 0 deletions

View File

@ -409,6 +409,36 @@ export const constantRoutes = [{
} }
}] }]
}, },
{
path: '/benyi_course/learndevelopmentteacherprint',
component: Layout,
hidden: true,
children: [{
path: 'table/:id',
component: () =>
import ('@/views/benyi/learndevelopmentteacher/table'),
name: 'learndevelopmentteacher2',
meta: {
title: '幼儿学习和发展档案(教师)(表格)',
icon: ''
}
}]
},
{
path: '/benyi_course/learndevelopmentfamilyprint',
component: Layout,
hidden: true,
children: [{
path: 'table/:id',
component: () =>
import ('@/views/benyi/learndevelopmentfamily/table'),
name: 'learndevelopmentfamily2',
meta: {
title: '幼儿学习和发展档案(家长)(表格)',
icon: ''
}
}]
},
{ {
path: '/benyi_course/math', path: '/benyi_course/math',
component: Layout, component: Layout,

View File

@ -110,6 +110,14 @@
class-name="small-padding fixed-width" class-name="small-padding fixed-width"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="handleView(scope.row)"
v-hasPermi="['benyi:learndevelopmentfamily:query']"
>预览</el-button
>
<el-button <el-button
size="mini" size="mini"
type="text" type="text"
@ -373,6 +381,13 @@ export default {
this.queryParams.pageNum = 1; this.queryParams.pageNum = 1;
this.getList(); this.getList();
}, },
/** 预览按钮操作 */
handleView(row) {
const id = row.id;
this.$router.push({
path: "/benyi_course/learndevelopmentfamilyprint/table/" + id,
});
},
/** 重置按钮操作 */ /** 重置按钮操作 */
resetQuery() { resetQuery() {
this.resetForm("queryForm"); this.resetForm("queryForm");

View File

@ -0,0 +1,249 @@
<template>
<div class="table-container" ref="printMe">
<h2 class="title">{{title}}</h2>
<div class="table">
<div class="print no-print">
<el-button type="primary" plain size="mini" icon="el-icon-printer" @click="prints"></el-button>
</div>
<table>
<tr class="align-center">
<td class="w140">
<b class="table-title">班级</b>
{{classname}}
</td>
<td>
<b class="table-title">学期</b>
{{xnxqFormat(xnxq)}}
</td>
<td class="w200">
<b class="table-title">幼儿姓名</b>
{{childFormat(childid)}}
</td>
</tr>
<tr>
<td class="align-center">作品照片</td>
<td colspan="2"><div v-html="zpimgs"></div></td>
</tr>
<tr>
<td class="align-center">备注</td>
<td colspan="2">{{zpimgsremarks}}</td>
</tr>
<tr>
<td class="align-center">生活照片</td>
<td colspan="2"><div v-html="shimgs"></div></td>
</tr>
<tr>
<td class="align-center">备注</td>
<td colspan="2">{{shimgsremarks}}</td>
</tr>
<tr>
<td class="align-center">有趣事件</td>
<td colspan="2"><div v-html="yqsj"></div></td>
</tr>
<tr>
<td class="align-center">备注</td>
<td colspan="2">{{yqsjremarks}}</td>
</tr>
<tr>
<td class="align-center">教师评语</td>
<td colspan="2"><div v-html="jspy"></div></td>
</tr>
<tr>
<td class="align-center">备注</td>
<td colspan="2">{{jspyremarks}}</td>
</tr>
</table>
<!-- <p
class="warning"
>此周计划表不需要发给家长只需上报教学主管制定班级一周教学与活动计划表请使用班级管理模块中教学与游戏活动周计划表以上报教学主管和作为周计划通知发给家长</p>-->
</div>
</div>
</template>
<script>
import {
listFamily,
getFamily,
delFamily,
addFamily,
updateFamily,
} from "@/api/benyi/learndevelopmentfamily";
import { listChild } from "@/api/benyi/child";
import Editor from "@/components/Editor";
export default {
name: "Family",
components: {
Editor,
},
data() {
return {
title: "幼儿学习与发展档案(教师)",
classname: "",
childid: "",
xnxq:"",
zpimgs: "",
zpimgsremarks: "",
shimgs: "",
shimgsremarks: "",
yqsj: "",
yqsjremarks: "",
jspy: "",
jspyremarks: "",
//
loading: true,
//
ids: [],
//
single: true,
//
multiple: true,
//
total: 0,
//
familyList: [],
//
childOptions: [],
//
xnxqOptions: [],
//
title: "",
//
open: false,
//
queryParams: {
},
//
form: {},
};
},
created() {
this.getList();
this.getChildList();
this.getDicts("sys_xnxq").then((response) => {
this.xnxqOptions = response.data;
});
},
methods: {
//
childFormat(childid) {
// return this.selectDictLabel(this.classOptions, row.classid);
var actions = [];
var datas = this.childOptions;
Object.keys(datas).map((key) => {
if (datas[key].id == "" + childid) {
actions.push(datas[key].name);
return false;
}
});
return actions.join("");
},
//
xnxqFormat(xnxq) {
return this.selectDictLabel(this.xnxqOptions, xnxq);
},
//
getChildList() {
listChild(null).then((response) => {
this.childOptions = response.rows;
this.classname = response.rows[0].bjmc;
});
},
/** 查询儿童学习与发展档案(家长)列表 */
getList() {
this.loading = true;
listFamily(this.queryParams).then((response) => {
this.familyList = response.rows;
this.xnxq = response.rows[0].xnxq;
this.childid = response.rows[0].childid;
this.zpimgs = response.rows[0].zpimgs;
this.zpimgsremarks = response.rows[0].zpimgremarks;
// console.log(response.rows);
this.shimgs = response.rows[0].shimgs;
this.shimgsremarks = response.rows[0].shimgsremarks;
this.yqsj = response.rows[0].yqsj;
this.yqsjremarks = response.rows[0].yqsjremarks;
this.jspy = response.rows[0].jspy;
this.jspyremarks = response.rows[0].jspyremarks;
this.total = response.total;
this.loading = false;
});
},
//
prints() {
//console.log(this.$refs.printMe);
this.$print(this.$refs.printMe);
},
},
};
</script>
<style lang="scss">
.table-container {
padding: 30px 10%;
.w140 {
width: 140px;
}
.w200 {
width: 200px;
}
.title {
margin: 0;
font-size: 18px;
text-align: center;
padding: 15px 0;
}
.title2 {
padding: 0;
}
.align-center {
text-align: center;
}
.table {
font-size: 14px;
.print {
display: flex;
justify-content: flex-end;
padding-bottom: 10px;
}
p {
margin: 0;
}
table {
width: 100%;
border-collapse: collapse;
}
table td {
border: #ccc solid 1px;
line-height: 24px;
padding: 8px 5px;
}
.table-title {
font-size: 16px;
}
.table-bg {
background: #f8f8f8;
}
}
.warning {
padding-top: 20px;
font-size: 12px;
color: #666;
}
}
@media print {
.table-container {
padding: 30px 0;
}
.print {
opacity: 0;
}
}
/*去除页眉页脚*/
@page {
size: auto; /* auto is the initial value */
margin: 3mm; /* this affects the margin in the printer settings */
}
</style>

View File

@ -110,6 +110,14 @@
class-name="small-padding fixed-width" class-name="small-padding fixed-width"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="handleView(scope.row)"
v-hasPermi="['benyi:learndevelopmentteacher:query']"
>预览</el-button
>
<el-button <el-button
size="mini" size="mini"
type="text" type="text"
@ -390,6 +398,13 @@ export default {
this.open = true; this.open = true;
this.title = "添加儿童学习与发展档案(教师)"; this.title = "添加儿童学习与发展档案(教师)";
}, },
/** 预览按钮操作 */
handleView(row) {
const id = row.id;
this.$router.push({
path: "/benyi_course/learndevelopmentteacherprint/table/" + id,
});
},
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {
this.reset(); this.reset();

View File

@ -0,0 +1,247 @@
<template>
<div class="table-container" ref="printMe">
<h2 class="title">{{title}}</h2>
<div class="table">
<div class="print no-print">
<el-button type="primary" plain size="mini" icon="el-icon-printer" @click="prints"></el-button>
</div>
<table>
<tr class="align-center">
<td class="w140">
<b class="table-title">班级</b>
{{classname}}
</td>
<td>
<b class="table-title">学期</b>
{{xnxqFormat(xnxq)}}
</td>
<td class="w200">
<b class="table-title">幼儿姓名</b>
{{childFormat(childid)}}
</td>
</tr>
<tr>
<td class="align-center">观察记录</td>
<td colspan="2"><div v-html="gcjl"></div></td>
</tr>
<tr>
<td class="align-center">备注</td>
<td colspan="2">{{gcjlremarks}}</td>
</tr>
<tr>
<td class="align-center">问题与方案</td>
<td colspan="2"><div v-html="wtyfa"></div></td>
</tr>
<tr>
<td class="align-center">备注</td>
<td colspan="2">{{wtyfaremarks}}</td>
</tr>
<tr>
<td class="align-center">评估结果</td>
<td colspan="2"><div v-html="pgjg"></div></td>
</tr>
<tr>
<td class="align-center">备注</td>
<td colspan="2">{{pgjgremarks}}</td>
</tr>
<tr>
<td class="align-center">教育计划</td>
<td colspan="2"><div v-html="jyjh"></div></td>
</tr>
<tr>
<td class="align-center">备注</td>
<td colspan="2">{{jyjhremarks}}</td>
</tr>
</table>
<!-- <p
class="warning"
>此周计划表不需要发给家长只需上报教学主管制定班级一周教学与活动计划表请使用班级管理模块中教学与游戏活动周计划表以上报教学主管和作为周计划通知发给家长</p>-->
</div>
</div>
</template>
<script>
import {
listTeacher,
getTeacher,
delTeacher,
addTeacher,
updateTeacher,
} from "@/api/benyi/learndevelopmentteacher";
import { listChild } from "@/api/benyi/child";
import Editor from "@/components/Editor";
export default {
name: "Teacher",
components: {
Editor,
},
data() {
return {
title: "幼儿学习与发展档案(教师)",
classname: "",
childid: "",
xnxq:"",
gcjl: "",
gcjlremarks: "",
wtyfa: "",
wtyfaremarks: "",
pgjg: "",
pgjgremarks: "",
jyjh: "",
jyjhremarks: "",
//
loading: true,
//
ids: [],
//
single: true,
//
multiple: true,
//
total: 0,
//
teacherList: [],
//
childOptions: [],
//
xnxqOptions: [],
//
// title: "",
//
open: false,
//
form: {},
};
},
created() {
this.getList();
this.getChildList();
this.getDicts("sys_xnxq").then((response) => {
this.xnxqOptions = response.data;
});
},
methods: {
//
childFormat(childid) {
// return this.selectDictLabel(this.classOptions, row.classid);
var actions = [];
var datas = this.childOptions;
Object.keys(datas).map((key) => {
if (datas[key].id == "" + childid) {
actions.push(datas[key].name);
return false;
}
});
return actions.join("");
},
// --
xnxqFormat(xnxq) {
return this.selectDictLabel(this.xnxqOptions, xnxq);
},
//
prints() {
//console.log(this.$refs.printMe);
this.$print(this.$refs.printMe);
},
//
getChildList() {
listChild(null).then((response) => {
this.childOptions = response.rows;
this.classname = response.rows[0].bjmc;
// console.log(response.rows);
});
},
/** 查询儿童学习与发展档案(教师)列表 */
getList() {
this.loading = true;
listTeacher(this.queryParams).then((response) => {
this.teacherList = response.rows;
this.xnxq = response.rows[0].xnxq;
this.childid = response.rows[0].childid;
this.gcjl = response.rows[0].gcjl;
this.gcjlremarks = response.rows[0].gcjlremarks;
this.jyjh = response.rows[0].jyjh;
this.jyjhremarks = response.rows[0].jyjhremarks;
this.pgjg = response.rows[0].pgjg;
this.pgjgremarks = response.rows[0].pgjgremarks;
this.wtyfa = response.rows[0].wtyfa;
this.wtyfaremarks = response.rows[0].wtyfaremarks;
//console.log(response.rows);
this.total = response.total;
this.loading = false;
});
},
},
};
</script>
<style lang="scss">
.table-container {
padding: 30px 10%;
.w140 {
width: 140px;
}
.w200 {
width: 200px;
}
.title {
margin: 0;
font-size: 18px;
text-align: center;
padding: 15px 0;
}
.title2 {
padding: 0;
}
.align-center {
text-align: center;
}
.table {
font-size: 14px;
.print {
display: flex;
justify-content: flex-end;
padding-bottom: 10px;
}
p {
margin: 0;
}
table {
width: 100%;
border-collapse: collapse;
}
table td {
border: #ccc solid 1px;
line-height: 24px;
padding: 8px 5px;
}
.table-title {
font-size: 16px;
}
.table-bg {
background: #f8f8f8;
}
}
.warning {
padding-top: 20px;
font-size: 12px;
color: #666;
}
}
@media print {
.table-container {
padding: 30px 0;
}
.print {
opacity: 0;
}
}
/*去除页眉页脚*/
@page {
size: auto; /* auto is the initial value */
margin: 3mm; /* this affects the margin in the printer settings */
}
</style>