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/components/editDietary.vue | 157 ++++++++++++++++++++++++++++++++--------------------
1 files changed, 96 insertions(+), 61 deletions(-)
diff --git a/src/views/home/components/editDietary.vue b/src/views/home/components/editDietary.vue
index 3214728..1a0177d 100644
--- a/src/views/home/components/editDietary.vue
+++ b/src/views/home/components/editDietary.vue
@@ -1,13 +1,13 @@
<template>
<div class="dietarySurvey-item">
- <el-dialog v-model="state.dialogTableVisible" title="营养膳食生活调查表" :fullscreen="true" width="100%">
+ <el-dialog v-model="state.dialogTableVisible" title="膳食生活调查表" :fullscreen="true" width="100%">
<div class="container" style="width: 100%; height: 100%;overflow: auto;">
- <div id="printFrom1">
+ <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>
@@ -217,18 +218,18 @@
</td>
<td colspan="5">
<el-form-item>
- <input style="width: 250px;" v-model="state.tableData.常吃的水果.食用份量"/> ;
+ <input style="width: 250px;" v-model="state.tableData.常吃的水果.input"/> ;
<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>
@@ -276,18 +277,18 @@
<td colspan="5">
<el-form-item>
- <input style="width: 250px;" v-model="state.tableData.坚果摄入量.食用份量"/> ;
+ <input style="width: 250px;" v-model="state.tableData.坚果摄入量.type"/> ;
<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.零食及其他
@@ -475,13 +477,13 @@
</el-checkbox>
<el-checkbox value="辛辣食品">辛辣食品
</el-checkbox>
- <el-checkbox value="石炭酉饮米斗">石炭酉饮米斗
+ <el-checkbox value="碳酸饮料">碳酸饮料
</el-checkbox>
</el-checkbox-group>
<span>
- <input style="width: 100px;" v-model="state.tableData.零食及其他.备注"/>
+ <input style="width: 250px;" v-model="state.tableData.零食及其他.备注"/>
</span>
</el-form-item>
@@ -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>
@@ -741,7 +743,14 @@
v-model="state.tableData.饮酒习惯.type">
<el-radio value="是">是
<span>
- <input style="width: 50px;" v-model="state.tableData.饮酒习惯.食用频次1"/> 根/天
+ 酒类
+ </span>
+ <span>
+ <input style="width: 200px;" v-model="state.tableData.饮酒习惯.备注"/>
+ </span>
+ 食用频次：
+ <span>
+ <input style="width: 50px;" v-model="state.tableData.饮酒习惯.食用频次1"/> ml/天
</span>
<span>
<input style="width: 50px;" v-model="state.tableData.饮酒习惯.食用频次2"/> 次/周
@@ -750,12 +759,7 @@
<el-radio value="否">否
</el-radio>
</el-radio-group>
- <span>
- 酒类
- </span>
- <span>
- <input style="width: 200px;" v-model="state.tableData.饮酒习惯.备注"/>
- </span>
+
</el-form-item>
</td>
</tr>
@@ -902,7 +906,7 @@
<el-button type="primary" @click="onSubmit">
保存
</el-button>
- <el-button v-if="state.viewInfo.id" type="primary" v-print="'#printFrom1'">
+ <el-button v-if="state.viewInfo.id" type="primary" v-print="'#printMe'">
<el-icon><Printer /></el-icon>
打印
</el-button>
@@ -940,7 +944,7 @@
const state = reactive({
dialogTableVisible:false,
tableData: {
- 表名: '营养膳食生活调查表',
+ 表名: '膳食生活调查表',
初次调查日期:"",
填表日期: '',
更新日期: '',
@@ -964,24 +968,24 @@
备注: '',
},
常吃的主食: {
- type: '', //只能选择独居或者家庭
+ type: [], //只能选择独居或者家庭
食用份量: '',
食用频次: '',
},
常吃的蔬菜: {
- type: '',
+ type: [],
食用份量: '',
食用频次: '',
},
常吃的肉类: {
- type: '',
+ type: [],
食用份量: '',
食用频次: ''
},
常吃的水果: {
食用份量: '',
食用频次: '',
- input3: ''
+ input: ''
},
常吃的大豆及其制品是: {
@@ -1124,7 +1128,7 @@
surveryTime: formatDate(new Date(), 'YYYY-mm-dd HH:MM:SS'),
surveryPerson: userInfos.value.code,
surveryJsonBody: '',
- suveryFormName:'营养膳食生活调查表',
+ suveryFormName:'膳食生活调查表',
surveryFormType:0,
updateTime: ''
}
@@ -1139,7 +1143,7 @@
}
const generatePDF=()=> {
- const element = document.getElementById('printFrom1');
+ const element = document.getElementById('printMe');
const opt = {
margin: 10,
filename: `${state.tableData.表名}.pdf`,
@@ -1162,7 +1166,7 @@
surveryTime: formatDate(new Date(), 'YYYY-mm-dd HH:MM:SS'),
surveryPerson: userInfos.value.code,
surveryJsonBody: JSON.stringify(state.tableData),
- suveryFormName:'营养膳食生活调查表',
+ suveryFormName:'膳食生活调查表',
updateTime: formatDate(new Date(), 'YYYY-mm-dd HH:MM:SS')
}
console.log(info)
@@ -1174,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
@@ -1184,7 +1189,7 @@
}
const getPageInfo=()=>{
state.tableData={
- 表名: '营养膳食生活调查表',
+ 表名: '膳食生活调查表',
初次调查日期: formatDate(new Date(),'YYYY-mm-dd'),
填表日期: '',
更新日期: formatDate(new Date(),'YYYY-mm-dd'),
@@ -1208,24 +1213,24 @@
备注: '',
},
常吃的主食: {
- type: '', //只能选择独居或者家庭
+ type: [], //只能选择独居或者家庭
食用份量: '',
食用频次: '',
},
常吃的蔬菜: {
- type: '',
+ type: [],
食用份量: '',
食用频次: '',
},
常吃的肉类: {
- type: '',
+ type: [],
食用份量: '',
食用频次: ''
},
常吃的水果: {
食用份量: '',
食用频次: '',
- input3: ''
+ input: ''
},
常吃的大豆及其制品是: {
type: '',
@@ -1366,7 +1371,7 @@
surveryTime: formatDate(new Date(), 'YYYY-mm-dd HH:MM:SS'),
surveryPerson: userInfos.value.code,
surveryJsonBody: '',
- suveryFormName:'营养膳食生活调查表',
+ suveryFormName:'膳食生活调查表',
surveryFormType:0,
updateTime: ''
}
@@ -1387,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
@@ -1404,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;
--
Gitblit v1.8.0