chenyc
2025-07-14 05c827fea632f004821cc746ba73880769fab7cd
src/views/home/components/dietary_survey.vue
@@ -1,117 +1,256 @@
<template>
    <div class="dietarySurvey-home">
        <div v-if="patientsInfo.id">
            <table class="gridtable">
                <tr>
                    <th colspan="4">膳食调查表</th>
                    <th>初次调查日期</th>
                    <th></th>
                </tr>
                <tr>
                    <th colspan="4"></th>
                    <th>更新日期</th>
                    <th></th>
                </tr>
                <tr>
                    <th colspan="4"></th>
                    <th>记录者</th>
                    <th></th>
                </tr>
                <tr>
                    <td>
                        1.人员构成
                    </td>
                    <td>
                       独居
                    </td>
                    <td>
                        (  )人
                    </td>
                    <td>
                        家族
                    </td>
                    <td colspan="2">
                       (        )
                    </td>
                </tr>
                <tr>
                    <td>
                        2.烹饪主要操作者
                    </td>
                    <td>
                        本人
                    </td>
                    <td>
                        配偶
                    </td>
                    <td>
                        其他
                    </td>
                    <td colspan="2">
                       (        )
                    </td>
                </tr>
                <tr>
                    <td>
                        3.食材采购
                    </td>
                    <td>
                        外采
                    </td>
                    <td>
                        家种
                    </td>
                    <td>
                    </td>
                    <td colspan="2">
    <div class="dietarySurvey-home" >
        <el-row v-if="patientsInfo.id"  style="padding-left: 10px;">
            <el-form size="small" :inline="true" :model="state.formInline">
                <!-- <el-form-item label="调差表">
                    <el-select style="width: 120px;"
                        v-model="state.formInline.formTableName"
                        placeholder="不选默认查全部"
                        clearable
                    >
                        <el-option label="膳食生活调查表" value="膳食生活调查表" />
                        <el-option label="膳食调查表" value="膳食调查表" />
                    </el-select>
                </el-form-item> -->
                <el-form-item label="填报日期">
                    <el-date-picker
                        v-model="state.formInline.date"
                        type="daterange"
                        unlink-panels
                        range-separator="To"
                        start-placeholder="开始"
                        end-placeholder="结束"
                        :shortcuts="shortcuts"
                        format="YYYY/MM/DD"
                        value-format="YYYY-MM-DD"
                    />
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit">查询</el-button>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" plain @click="addItem">添加</el-button>
                </el-form-item>
            </el-form>
        </el-row>
        <div v-if="patientsInfo.id"  class="divcont">
            <el-table size="default" :data="state.tableData" stripe style="width: 100%"  :height="tableHe">
                <el-table-column fixed label="NO" type="index" widtd="80" >
                        <template #header>
                            <el-icon @click="onSubmit"><RefreshRight /></el-icon>
                        </template>
                      
                    </td>
                </tr>
            </table>
                    </el-table-column>
                    <el-table-column  prop="surveryTime" label="填表时间" show-overflow-tooltip >
                        <template #default="scope">
                            {{scope.row.surveryTime?.substring(0,11)}}
                        </template>
                    </el-table-column>
                    <el-table-column  prop="surveryTime" label="调查表名称" show-overflow-tooltip >
                        <template #default="scope">
                            {{scope.row.suveryFormName}}
                        </template>
                    </el-table-column>
                    <el-table-column  prop="surveryPersonName" label="填表人" show-overflow-tooltip />
                    <!-- <el-table-column  prop="updateTime" label="更新时间" show-overflow-tooltip /> -->
                    <el-table-column  label="操作" >
                        <template #default="scope">
                            <el-button size="small" @click="handleEdit(scope.$index, scope.row)">
                                    编辑
                            </el-button>
                            <el-button
                            size="small"
                            type="danger"
                            @click="handleDelete(scope.$index, scope.row)"
                            >
                                 删除
                            </el-button>
                        </template>
                    </el-table-column>
            </el-table>
            <el-pagination
                v-model:current-page="state.page"
                v-model:page-size="state.size"
                :page-sizes="[10, 20, 30, 40]"
                layout="total, sizes, prev, pager, next, jumper"
                :total="state.total"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                />
        </div>
        <el-empty v-else description="无数据,请先选择患者"></el-empty>
        <el-empty v-if="!patientsInfo.id" description="无数据,请先选择患者"></el-empty>
        <editDietary  @shuaxin="onSubmit" ref="editDietaryRef"></editDietary>
    </div>
</template>
<script setup lang="ts">
import { storeToRefs } from 'pinia';
import { usePatientsInfo } from '/@/stores/patientsInfo';
import { computed, reactive } from 'vue';
import {list,tiaochabiaoInfo,deleteId} from '/@/api/tiaochabiao/index'
import { computed, reactive, ref } from 'vue';
import editDietary2 from './editDietary2.vue'
import editDietary from './editDietary.vue'
import { useRoute,useRouter } from 'vue-router';
import { ElLoading, ElMessage, ElMessageBox } from 'element-plus';
const storesPat = usePatientsInfo();
const { patientsInfo } = storeToRefs(storesPat);
const props = defineProps(['tableHeight'])
const editDietaryRef=ref()
const router = useRouter()
const shortcuts = [
  {
    text: '上一周',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
      return [start, end]
    },
  },
  {
    text: '上一个月',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
      return [start, end]
    },
  },
  {
    text: '前三个月',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
      return [start, end]
    },
  },
]
const state = reactive({
    tableData: [],
    page:1,
    size:10,
    total:0,
    loading: false,
    formInline:{
        user: '',
        formTableName:'膳食生活调查表',
        date: [],
    },
    dialogTableVisible:false
})
const tableHe = computed(() => {
    return props.tableHeight - 130
    return (props.tableHeight-200)+'px'
})
const handleSizeChange = (val: number) => {
  console.log(`${val} items per page`)
  state.size=val
  onSubmit()
}
const handleCurrentChange = (val: number) => {
  console.log(`current page: ${val}`)
  state.page=val
  onSubmit()
}
const onSubmit=()=>{
    console.log(state.formInline)
    const pasm={
        page: state.page,
        size: state.size,
        wherecondition:`survery_form_type=0 and patient_code='${patientsInfo.value.code}'`,
        ordercondition: 'survery_time desc'
    }
    if(state.formInline?.date?.length===2){
        pasm.wherecondition+=` and survery_time BETWEEN '${state.formInline.date[0]} 00:00:00' AND '${state.formInline.date[1]} 23:59:59'`
    }
    if(state.formInline?.formTableName){
        pasm.wherecondition+=`and suvery_form_name='${state.formInline.formTableName}'`
    }
    const loading = ElLoading.service({
        lock: true,
        text: 'Loading',
        background: 'rgba(0, 0, 0, 0.7)',
    })
    list(pasm).then(re=>{
        state.tableData=re.data.list
        state.total=re.data.total
    }).finally(()=>{
        loading.close()
    })
}
const addItem=()=>{
    editDietaryRef.value.openShow('add')
    // router.push({path:'/tiaochabiao1',query:{type:'add',id:0}})
}
// 第一步:定义子组件里面的方法
const getData = (str: string) => {
    console.log("子组件获取显示数据!" + str);
    console.log(props.tableHeight)
    var pam = {
        patientCode: patientsInfo.value.code,
    const pasm = {
        page: 1,
        size: 100,
        orderType: 1,
        orderIsUse: 2,
        desc: 1,
        orderName: '',
        size: 10,
        wherecondition:`survery_form_type=0 and patient_code='${patientsInfo.value.code}'`,
        ordercondition:'survery_time DESC'
    }
    if(state.formInline?.date?.length===2){
        pasm.wherecondition+=`and survery_time BETWEEN '${state.formInline.date[0]} 00:00:00' AND '${state.formInline.date[1]} 23:59:59'`
    }
    if(state.formInline.formTableName){
        pasm.wherecondition+=`and suvery_form_name='${state.formInline.formTableName}'`
    }
    const loading = ElLoading.service({
        lock: true,
        text: 'Loading',
        background: 'rgba(0, 0, 0, 0.7)',
    })
    list(pasm).then(re=>{
        console.log(re)
        state.tableData=re.data.list
        state.total=re.data.total
    }).finally(()=>{
        loading.close()
    })
    state.loading = true
}
// 第二步:暴露方法
defineExpose({ getData })
/**
 * 编辑
 */
const handleEdit = (index: number, row: any) => {
  console.log(index, row,state.formInline.formTableName)
  editDietaryRef.value.openShow('update',row)
}
const handleDelete = (index: number, row: any) => {
  console.log(index, row)
  ElMessageBox.confirm(
    '你确定要删除该条记录?',
    'Warning',
    {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
        deleteId(`id=${row.id}`).then(re=>{
            ElMessage.success('删除成功')
            onSubmit()
        }).catch(e=>{
            ElMessage.error('删除失败!')
        })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '取消操作',
      })
    })
}
</script>
<style  lang="scss">
@@ -121,7 +260,28 @@
    .gridtable th {border-width: 1px;padding: 8px;border-style: solid;border-color: #666666;background-color: #dedede;}
    .gridtable td {border-width: 1px;padding: 8px;border-style: solid;border-color: #666666;background-color: #ffffff;}
    .gridtable td {border-width: 1px;padding: 8px;border-style: solid;border-color: #666666;background-color: #ffffff;min-width: 100px;}
    .input-underline {
        border: none; /* 移除所有边框 */
        border-bottom: 1px solid #ccc; /* 显示下边框 */
        outline: none; /* 移除点击输入框时浏览器可能会提供的默认轮廓线 */
        text-align: center;
    }
    .width50{
        width: 50px;
    }
.infinite-list {
    overflow: auto;
    padding: 0;
    margin: 0;
    list-style: none;
}
.infinite-list .infinite-list-item {
  display: flex;
}
.divcont{
    overflow-y: auto; /* 垂直滚动条 */
}
</style>