From 142a750b078c089a3f5373db7874f96ca93f458a Mon Sep 17 00:00:00 2001
From: chenyc <501753378@qq.com>
Date: 星期五, 28 二月 2025 15:07:04 +0800
Subject: [PATCH] gx
---
src/views/home/index.vue | 6 --
src/views/home/components/editDietary2.vue | 28 ++++++++-
src/views/home/components/editDietary.vue | 117 +++++++++++++++++++++++++--------------
3 files changed, 99 insertions(+), 52 deletions(-)
diff --git a/src/views/home/components/editDietary.vue b/src/views/home/components/editDietary.vue
index 49992ca..1a0177d 100644
--- a/src/views/home/components/editDietary.vue
+++ b/src/views/home/components/editDietary.vue
@@ -2,12 +2,12 @@
<div class="dietarySurvey-item">
<el-dialog v-model="state.dialogTableVisible" title="膳食生活调查表" :fullscreen="true" width="100%">
<div class="container" style="width: 100%; height: 100%;overflow: auto;">
- <div id="sahnshishenghuo">
+ <div id="printMe">
<div>
<el-form size="small">
<div style="width: 100%">
<table id="tabledome" class="gridtable">
-
+
<tr>
<th colspan="2">
<el-form-item label="初次调查日期">
@@ -128,27 +128,27 @@
1.常吃的主食
</td>
<td colspan="5">
- <el-form-item>
- <el-radio-group
+ <el-form-item>
+ <el-checkbox-group
v-model="state.tableData.常吃的主食.type">
- <el-checkbox value="精米面类">A.精米面类</el-checkbox>
- <el-checkbox value="杂豆类">B.杂豆类</el-checkbox>
- <el-checkbox value="粗粮">C.粗粮</el-checkbox>
- <el-checkbox value="薯类">B.薯类</el-checkbox>
- <el-checkbox value="其它">E.其它</el-checkbox>
+ <el-checkbox value="精米面类">A.精米面类</el-checkbox>
+ <el-checkbox value="杂豆类">B.杂豆类</el-checkbox>
+ <el-checkbox value="粗粮">C.粗粮</el-checkbox>
+ <el-checkbox value="薯类">B.薯类</el-checkbox>
+ <el-checkbox value="其它">E.其它</el-checkbox>
- </el-radio-group>
+ </el-checkbox-group >
<span>食用份量</span>
<span>
- <input style="width: 50px;" v-model="state.tableData.常吃的主食.食用份量"/> 克/天
+ <input :style="{width:state.tableData?.常吃的主食?.食用份量?.length?state.tableData?.常吃的主食?.食用份量?.length*15+'px':'50px'}" v-model="state.tableData.常吃的主食.食用份量"/> 克/天
</span>
<span>食用频次</span>
- <input style="width: 50px;" v-model="state.tableData.常吃的主食.食用频次"/> 次/周
+ <input :style="{width:state.tableData?.常吃的主食?.食用频次?.length?state.tableData?.常吃的主食?.食用频次?.length*15+'px':'50px'}" v-model="state.tableData.常吃的主食.食用频次"/> 次/周
</el-form-item>
</td>
</tr>
@@ -158,24 +158,25 @@
</td>
<td colspan="5">
<el-form-item>
- <el-radio-group v-model="state.tableData.常吃的蔬菜.type">
+ <el-checkbox-group v-model="state.tableData.常吃的蔬菜.type">
<el-checkbox value="叶菜">A.叶菜</el-checkbox>
<el-checkbox value="根茎类">B.根茎类</el-checkbox>
<el-checkbox value="瓜茄">C.瓜茄</el-checkbox>
<el-checkbox value="鲜豆">B.鲜豆</el-checkbox>
<el-checkbox value="菌藻">E.菌藻</el-checkbox>
- </el-radio-group>
+ </el-checkbox-group >
+ <br/>
<span>食用份量</span>
<span>
- <input style="width: 50px;" v-model="state.tableData.常吃的蔬菜.食用份量"/> 克/天
+ <input :style="{width:state.tableData?.常吃的蔬菜?.食用份量?.length?state.tableData?.常吃的蔬菜?.食用份量?.length*15+'px':'50px'}" v-model="state.tableData.常吃的蔬菜.食用份量"/> 克/天
</span>
<span>食用频次</span>
- <input style="width: 50px;" v-model="state.tableData.常吃的蔬菜.食用频次"/> 次/周
+ <input :style="{width:state.tableData?.常吃的蔬菜?.食用频次?.length?state.tableData?.常吃的蔬菜?.食用频次?.length*15+'px':'50px'}" v-model="state.tableData.常吃的蔬菜.食用频次"/> 次/周
</el-form-item>
@@ -188,24 +189,24 @@
<td colspan="5">
<el-form-item>
- <el-radio-group v-model="state.tableData.常吃的肉类.type">
+ <el-checkbox-group v-model="state.tableData.常吃的肉类.type">
<el-checkbox value="畜产品">A.畜产品</el-checkbox>
<el-checkbox value="禽产品">B.禽产品</el-checkbox>
<el-checkbox value="水产品类">C.水产品类</el-checkbox>
<el-checkbox value="蛋类">D.蛋类</el-checkbox>
<el-checkbox value="其他">E.其他</el-checkbox>
- </el-radio-group>
+ </el-checkbox-group>
<span>食用份量</span>
<span>
- <input style="width: 50px;" v-model="state.tableData.常吃的肉类.食用份量"/> 克/天
+ <input :style="{width:state.tableData?.常吃的肉类?.食用份量?.length?state.tableData?.常吃的肉类?.食用份量?.length*15+'px':'50px'}" v-model="state.tableData.常吃的肉类.食用份量"/> 克/天
</span>
<span>食用频次</span>
- <input style="width: 50px;" v-model="state.tableData.常吃的肉类.食用频次"/> 次/周
+ <input :style="{width:state.tableData?.常吃的肉类?.食用频次?.length?state.tableData?.常吃的肉类?.食用频次?.length*15+'px':'50px'}" v-model="state.tableData.常吃的肉类.食用频次"/> 次/周
</el-form-item>
@@ -222,13 +223,13 @@
<span>食用份量</span>
<span>
- <input style="width: 50px;" v-model="state.tableData.常吃的水果.食用份量"/> 克/天;
+ <input :style="{width:state.tableData?.常吃的水果?.食用份量?.length?state.tableData?.常吃的水果?.食用份量?.length*15+'px':'50px'}" v-model="state.tableData.常吃的水果.食用份量"/> 克/天;
</span>
<span>食用频次</span>
- <input style="width: 50px;" v-model="state.tableData.常吃的水果.食用频次"/> 次/周
+ <input :style="{width:state.tableData?.常吃的水果?.食用份量?.length?state.tableData?.常吃的水果?.食用频次?.length*15+'px':'50px'}" v-model="state.tableData.常吃的水果.食用频次"/> 次/周
</el-form-item>
</td>
@@ -256,12 +257,12 @@
<span>食用份量</span>
<span>
- <input style="width: 50px;" v-model="state.tableData.常吃的大豆及其制品是.食用份量"/> 克/天
+ <input :style="{width:state.tableData?.常吃的大豆及其制品是?.食用份量?.length?state.tableData?.常吃的大豆及其制品是?.食用份量?.length*15+'px':'50px'}" v-model="state.tableData.常吃的大豆及其制品是.食用份量"/> 克/天
</span>
<span>食用频次</span>
- <input style="width: 50px;" v-model="state.tableData.常吃的大豆及其制品是.食用频次"/> 次/周
+ <input :style="{width:state.tableData?.常吃的大豆及其制品是?.食用频次?.length?state.tableData?.常吃的大豆及其制品是?.食用频次?.length*15+'px':'50px'}" v-model="state.tableData.常吃的大豆及其制品是.食用频次"/> 次/周
</el-form-item>
@@ -281,13 +282,13 @@
<span>食用份量</span>
<span>
- <input style="width: 50px;" v-model="state.tableData.坚果摄入量.食用份量"/> 克/天;
+ <input :style="{width:state.tableData?.坚果摄入量?.食用份量?.length?state.tableData?.坚果摄入量?.食用份量?.length*15+'px':'50px'}" v-model="state.tableData.坚果摄入量.食用份量"/> 克/天;
</span>
<span>食用频次</span>
- <input style="width: 50px;" v-model="state.tableData.坚果摄入量.食用频次"/> 次/周
+ <input :style="{width:state.tableData?.坚果摄入量?.食用频次?.length?state.tableData?.坚果摄入量?.食用频次?.length*15+'px':'50px'}" style="width: 50px;" v-model="state.tableData.坚果摄入量.食用频次"/> 次/周
</el-form-item>
@@ -316,13 +317,13 @@
<span>食用份量</span>
<span>
- <input style="width: 50px;" v-model="state.tableData.奶类摄入量.食用份量"/> 克/天
+ <input :style="{width:state.tableData?.奶类摄入量?.食用份量?.length?state.tableData?.奶类摄入量?.食用份量?.length*15+'px':'50px'}" v-model="state.tableData.奶类摄入量.食用份量"/> 克/天
</span>
<span>食用频次</span>
- <input style="width: 50px;" v-model="state.tableData.奶类摄入量.食用频次"/> 次/周
+ <input :style="{width:state.tableData?.奶类摄入量?.食用频次?.length?state.tableData?.奶类摄入量?.食用频次?.length*15+'px':'50px'}" v-model="state.tableData.奶类摄入量.食用频次"/> 次/周
</el-form-item>
</td>
</tr>
@@ -451,6 +452,7 @@
</el-form-item>
</td>
</tr>
+ <div class="page-break"></div>
<tr>
<td>
12.零食及其他
@@ -639,32 +641,32 @@
<tr>
<td>
<el-form-item>
- <el-input type="textarea" v-model="state.tableData.二十四小时饮食回顾记录.早餐" placeholder="" />
+ <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 6 }" v-model="state.tableData.二十四小时饮食回顾记录.早餐" placeholder="" />
</el-form-item>
</td>
<td>
<el-form-item>
- <el-input type="textarea" v-model="state.tableData.二十四小时饮食回顾记录.早加餐" placeholder="" />
+ <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 6 }" v-model="state.tableData.二十四小时饮食回顾记录.早加餐" placeholder="" />
</el-form-item>
</td>
<td>
<el-form-item>
- <el-input type="textarea" v-model="state.tableData.二十四小时饮食回顾记录.午餐" placeholder="" />
+ <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 6 }" v-model="state.tableData.二十四小时饮食回顾记录.午餐" placeholder="" />
</el-form-item>
</td>
<td>
<el-form-item>
- <el-input type="textarea" v-model="state.tableData.二十四小时饮食回顾记录.午加餐" placeholder="" />
+ <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 6 }" v-model="state.tableData.二十四小时饮食回顾记录.午加餐" placeholder="" />
</el-form-item>
</td>
<td>
<el-form-item>
- <el-input type="textarea" v-model="state.tableData.二十四小时饮食回顾记录.晚餐" placeholder="" />
+ <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 6 }" v-model="state.tableData.二十四小时饮食回顾记录.晚餐" placeholder="" />
</el-form-item>
</td>
<td>
<el-form-item>
- <el-input type="textarea" v-model="state.tableData.二十四小时饮食回顾记录.晚加餐" placeholder="" />
+ <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 6 }" v-model="state.tableData.二十四小时饮食回顾记录.晚加餐" placeholder="" />
</el-form-item>
</td>
</tr>
@@ -904,7 +906,7 @@
<el-button type="primary" @click="onSubmit">
保存
</el-button>
- <el-button v-if="state.viewInfo.id" type="primary" v-print="'#sahnshishenghuo'">
+ <el-button v-if="state.viewInfo.id" type="primary" v-print="'#printMe'">
<el-icon><Printer /></el-icon>
打印
</el-button>
@@ -966,17 +968,17 @@
备注: '',
},
常吃的主食: {
- type: '', //只能选择独居或者家庭
+ type: [], //只能选择独居或者家庭
食用份量: '',
食用频次: '',
},
常吃的蔬菜: {
- type: '',
+ type: [],
食用份量: '',
食用频次: '',
},
常吃的肉类: {
- type: '',
+ type: [],
食用份量: '',
食用频次: ''
},
@@ -1141,7 +1143,7 @@
}
const generatePDF=()=> {
- const element = document.getElementById('sahnshishenghuo');
+ const element = document.getElementById('printMe');
const opt = {
margin: 10,
filename: `${state.tableData.表名}.pdf`,
@@ -1176,6 +1178,7 @@
})
}else if(info.id>0){
info.surveryTime=state.viewInfo.surveryTime
+ console.log()
update(info).then(re=>{
console.log(re.data)
state.dialogTableVisible=false
@@ -1210,17 +1213,17 @@
备注: '',
},
常吃的主食: {
- type: '', //只能选择独居或者家庭
+ type: [], //只能选择独居或者家庭
食用份量: '',
食用频次: '',
},
常吃的蔬菜: {
- type: '',
+ type: [],
食用份量: '',
食用频次: '',
},
常吃的肉类: {
- type: '',
+ type: [],
食用份量: '',
食用频次: ''
},
@@ -1389,6 +1392,7 @@
}
else if(type==='update'){
console.log(mode)
+ console.log(JSON.parse(mode.surveryJsonBody))
state.viewInfo=mode
state.tableData=JSON.parse(mode.surveryJsonBody)
state.tableData.初次调查日期=mode.surveryTime
@@ -1406,7 +1410,36 @@
<style scoped lang="scss">
+@media print {
+ body * {
+ visibility: hidden;
+ }
+ #printMe, #printMe * {
+ visibility: visible;
+ }
+ #printMe {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ }
+ /* 防止内容在页面边界处被截断 */
+ p, h1, div {
+ page-break-inside: avoid;
+ }
+
+ /* 确保表格行不会被截断（如果有表格的话） */
+ table tr {
+ page-break-inside: avoid;
+ }
+
+ /* 设置页面大小和边距 */
+ @page {
+ size: A4;
+ margin: 0mm;
+ }
+}
.gridtable {
font-family: verdana, arial, sans-serif;
font-size: 11px;
diff --git a/src/views/home/components/editDietary2.vue b/src/views/home/components/editDietary2.vue
index 763e288..7a133b8 100644
--- a/src/views/home/components/editDietary2.vue
+++ b/src/views/home/components/editDietary2.vue
@@ -2,7 +2,7 @@
<div class="dietarySurvey-item">
<el-dialog v-model="state.dialogTableVisible" title="营养膳食调查表" :fullscreen="true" width="100%">
<div class="container" style="width: 100%; height: 100%;overflow: auto;">
- <div id='printFrom2'>
+ <div id='printMe'>
<div>
<el-form size="small">
<div style="width: 100%">
@@ -680,9 +680,9 @@
<el-button type="primary" @click="onSubmit">
保存
</el-button>
- <el-button v-if="state.viewInfo.id" type="primary" v-print="'#printFrom2'">
+ <el-button v-if="state.viewInfo.id" type="primary" v-print="'#printMe'">
<el-icon><Printer /></el-icon>
- 打印
+ 打印ddd
</el-button>
<el-button type="primary" v-if="state.viewInfo.id" @click="generatePDF">
<el-icon><Position /></el-icon>
@@ -890,7 +890,7 @@
state.dialogTableVisible = false
}
const generatePDF=()=> {
- const element = document.getElementById('printFrom2');
+ const element = document.getElementById('printMe');
const opt = {
margin: 10,
filename: `${state.tableData.表名}.pdf`,
@@ -1131,6 +1131,26 @@
<style scoped lang="scss">
+@media print {
+ body * {
+ visibility: hidden;
+ }
+ #printMe, #printMe * {
+ visibility: visible;
+ }
+ #printMe {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: auto;
+ }
+
+ /* 控制分页 */
+ .page-break {
+ page-break-before: always;
+ }
+}
.gridtable {
font-family: verdana, arial, sans-serif;
font-size: 11px;
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index d2212d2..c71a107 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -337,8 +337,6 @@
</script>
<style lang="scss">
-$homeNavLengh: 8;
-
.home-container {
overflow: hidden;
@@ -407,8 +405,4 @@
}
}
-.parent {
- display: grid;
- grid-template-columns: minmax(150px, 20%) 1fr;
-}
</style>
--
Gitblit v1.8.0