|
@@ -0,0 +1,988 @@
|
|
|
+<template>
|
|
|
+ <div class="p-2">
|
|
|
+ <!-- 新增顶部操作栏 -->
|
|
|
+ <el-row type="flex" align="middle" justify="space-between" style="margin-bottom: 16px;">
|
|
|
+ <el-col :span="4">
|
|
|
+ <el-button type="primary" plain @click="close" style="margin-right: 20px;">返回</el-button>
|
|
|
+ <span style="font-size: 14px; vertical-align: middle;">新增量表</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4" style="text-align: right;">
|
|
|
+ <el-button type="primary" plain @click="handlePreview" style="margin-right: 8px;">预览</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm">保存</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-container class="layout-container-demo" style="height: 100vh; min-height: 100vh;">
|
|
|
+ <el-aside id="leftPanel"
|
|
|
+ style="background:transparent; width: 450px; min-width: 300px; max-width: 500px; flex: 0 0 auto; border-right: 2px solid #e4e7ed;">
|
|
|
+ <div style="background:#f6f9fc; border-radius:4px; margin-bottom: 16px; padding: 16px 0;">
|
|
|
+ <div style="font-weight:bold; font-size:16px; padding:0 24px 8px 24px; cursor:pointer;"
|
|
|
+ @click="showSystemParam = !showSystemParam">
|
|
|
+ 系统参数
|
|
|
+ <i class="el-icon-arrow-down" :style="{
|
|
|
+ float: 'right',
|
|
|
+ transition: 'transform 0.2s',
|
|
|
+ transform: showSystemParam ? 'rotate(0deg)' : 'rotate(-90deg)'
|
|
|
+ }"></i>
|
|
|
+ </div>
|
|
|
+ <div v-show="showSystemParam" style="padding: 16px 16px 0 16px;">
|
|
|
+ <div style="font-weight: bold; margin-bottom: 8px;">基本信息</div>
|
|
|
+ <el-row :gutter="20" style="margin-bottom: 24px;">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="param-btn" plain @click="handleBaseBtnClick('gender', '性别')">性别</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="param-btn" plain @click="handleBaseBtnClick('birthDate', '出生日期')">出生日期</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="param-btn" plain @click="handleBaseBtnClick('height', '身高')">身高</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="param-btn" plain @click="handleBaseBtnClick('weight', '体重')">体重</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="param-btn" plain @click="handleBaseBtnClick('BMI', 'BMI')">BMI</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="param-btn" plain
|
|
|
+ @click="handleBaseBtnClick('nutritionalDiagnosis', '营养诊断')">营养诊断</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="param-btn" plain @click="handleBaseBtnClick('admissionDate', '入院日期')">入院日期</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <div style="font-weight: bold; margin-bottom: 8px;">其他</div>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="param-btn" plain
|
|
|
+ @click="handleOtherBtnClick('anthropometry', '人体测量')">人体测量</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="param-btn" plain
|
|
|
+ @click="handleOtherBtnClick('dietaryStatus', '膳食状况')">膳食状况</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="param-btn" plain
|
|
|
+ @click="handleOtherBtnClick('nutritionalBiochemical', '营养生化检查')">营养生化检查</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div style="background:#f6f9fc; border-radius:4px; margin-bottom: 16px; padding: 16px 0;">
|
|
|
+ <div style="font-weight:bold; font-size:16px; padding:0 24px 8px 24px; cursor:pointer;"
|
|
|
+ @click="showQuestionType = !showQuestionType">
|
|
|
+ 题型选择
|
|
|
+ <i class="el-icon-arrow-down" :style="{
|
|
|
+ float: 'right',
|
|
|
+ transition: 'transform 0.2s',
|
|
|
+ transform: showQuestionType ? 'rotate(0deg)' : 'rotate(-90deg)'
|
|
|
+ }"></i>
|
|
|
+ </div>
|
|
|
+ <div v-show="showQuestionType" style="min-height:40px; padding:0 24px 16px 24px;">
|
|
|
+ <el-row :gutter="12">
|
|
|
+ <el-col :span="8"><el-button class="param-btn" plain>单选题</el-button></el-col>
|
|
|
+ <el-col :span="8"><el-button class="param-btn" plain>多选题</el-button></el-col>
|
|
|
+ <el-col :span="8"><el-button class="param-btn" plain>填空题</el-button></el-col>
|
|
|
+ <el-col :span="8"><el-button class="param-btn" plain>量表题</el-button></el-col>
|
|
|
+ <el-col :span="8"><el-button class="param-btn" plain>矩阵量表</el-button></el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-aside>
|
|
|
+ <el-container>
|
|
|
+ <el-main style="padding-left: 20px;">
|
|
|
+ <el-scrollbar>
|
|
|
+ <div style="width: 50%;">
|
|
|
+ <el-form label-width="100px" label-position="left">
|
|
|
+ <el-form-item label="量表类型:" required>
|
|
|
+ <el-radio-group v-model="form.type">
|
|
|
+ <el-radio label="营养筛查" value="1" />
|
|
|
+ <el-radio label="营养评估" value="2" />
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="适用条件:" required>
|
|
|
+ <!-- 可留空或加说明 -->
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="性别:" style="margin-left: 20px;">
|
|
|
+ <el-radio-group v-model="form.gender" style="margin-left: -50px;">
|
|
|
+ <el-radio label="不限" value="-1">不限</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="年龄:" style="margin-left: 20px;">
|
|
|
+ <el-radio-group v-model="form.age" style="margin-left: -50px;">
|
|
|
+ <el-radio label="不限" style="width: 50%" value="-1">不限</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="量表名称:" required>
|
|
|
+ <el-input v-model="form.name" maxlength="50" show-word-limit placeholder="请输入" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="量表说明:">
|
|
|
+ <el-input v-model="form.description" maxlength="50" show-word-limit placeholder="请输入" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="备注:">
|
|
|
+ <el-input type="textarea" v-model="form.remark" maxlength="500" show-word-limit placeholder="请输入"
|
|
|
+ :rows="3" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="baseInfo.questionType" @click="selectBaseInfo" :class="{ selectedDiv: baseInfo.selected }">
|
|
|
+ <span> </span>
|
|
|
+ <div style="width: 50%;margin-top: 32px;">
|
|
|
+ <el-form label-width="100px" label-position="left">
|
|
|
+ <el-form-item label="1. 标题:" required>
|
|
|
+ <el-input :value="baseInfo.title" readonly />
|
|
|
+ </el-form-item>
|
|
|
+ <div style="margin-left: 60px;">
|
|
|
+ <template v-for="ctl in baseInfo.contentList">
|
|
|
+ <el-form-item label="填空:">
|
|
|
+ <el-input :value="ctl.label" readonly style="margin-left: -50px;">
|
|
|
+ <template #append><el-button @click="handleBaseBtnDelete(ctl.nameEn)">-</el-button></template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div style="display: flex; align-items: right;justify-content: right;padding-right: 50px;">
|
|
|
+ <el-button type="primary" icon="Delete" plain @click="deleteBaseInfo">删除</el-button>
|
|
|
+ </div>
|
|
|
+ <span> </span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <template v-for="other, index in otherInfo">
|
|
|
+ <div style="border-bottom: 1px solid #e5e7eb;" :class="{ selectedDiv: other.selected }"
|
|
|
+ @click="selectOtherInfo(index)">
|
|
|
+ <span> </span>
|
|
|
+ <div style="width: 50%;margin-top: 32px;">
|
|
|
+ <div>
|
|
|
+ <el-form label-width="100px" label-position="left">
|
|
|
+ <el-form-item :label="(index + 1 + baseInfo.contentList.length) + '. 标题:'" required>
|
|
|
+ <el-input :value="other.title" readonly />
|
|
|
+ </el-form-item>
|
|
|
+ <template v-for="ctl, idx in other.contentList">
|
|
|
+ <template v-if="ctl.formType == 'radio'">
|
|
|
+ <div style="margin-left: -50px;width: 1024px;">
|
|
|
+ <div style="background-color: #e5e7eb; margin-left: 60px;height: 40px;line-height: 40px;
|
|
|
+ margin-top: 5px;margin-bottom: 15px;" v-if="idx == 0">
|
|
|
+ <div style="text-align:left;margin-left: 50px;">选项(单选)</div>
|
|
|
+ </div>
|
|
|
+ <el-form-item>
|
|
|
+ <el-radio-group>
|
|
|
+ <el-radio :value="idx" :disabled="true">
|
|
|
+ 选项{{ idx + 1 }}:
|
|
|
+ <el-input v-model="ctl.value" :value="ctl.label" readonly style="width: 450px;">
|
|
|
+ <template #append><el-button
|
|
|
+ @click="handleBaseBtnDelete(ctl.nameEn)">-</el-button></template>
|
|
|
+ </el-input>
|
|
|
+ </el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="ctl.formType == 'radioScore'">
|
|
|
+ <div style="margin-left: -50px;width: 1024px;">
|
|
|
+ <div style="background-color: #e5e7eb; margin-left: 60px;height: 40px;line-height: 40px;
|
|
|
+ margin-top: 5px;margin-bottom: 15px;" v-if="idx == 0">
|
|
|
+ <div style="display:inline;text-align:left;margin-left: 50px;">选项(单选)</div>
|
|
|
+ <div style="display:inline;text-align:left;margin-left: 340px;">分值设置</div>
|
|
|
+ </div>
|
|
|
+ <el-form-item>
|
|
|
+ <el-radio-group>
|
|
|
+ <el-radio :value="idx" :disabled="true" :key="idx">
|
|
|
+ 选项{{ idx + 1 }}:
|
|
|
+ <el-input v-model="ctl.value" :value="ctl.label" readonly>
|
|
|
+ <template #append><el-button
|
|
|
+ @click="handleBaseBtnDelete(ctl.nameEn)">-</el-button></template>
|
|
|
+ </el-input>
|
|
|
+
|
|
|
+ <el-input v-model="ctl.score" :value="idx" style="width: 50px;margin-left: 20px;" />
|
|
|
+ </el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <div style="margin-left: 60px;">
|
|
|
+ <el-form-item label="填空:">
|
|
|
+ <el-input :value="ctl.label" readonly style="margin-left: -50px;">
|
|
|
+ <template #append><el-button
|
|
|
+ @click="handleBaseBtnDelete(ctl.nameEn)">-</el-button></template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div style="display: flex; align-items: right;justify-content: right;padding-right: 50px;">
|
|
|
+ <el-button type="primary" icon="Top" plain>上移</el-button>
|
|
|
+ <el-button type="primary" icon="Bottom" plain>下移</el-button>
|
|
|
+ <el-button type="primary" icon="Upload" plain>置顶</el-button>
|
|
|
+ <el-button type="primary" icon="Download" plain>置底</el-button>
|
|
|
+ <el-button type="primary" icon="Delete" plain @click="deleteOtherInfo(index)">删除</el-button>
|
|
|
+ </div>
|
|
|
+ <span> </span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+
|
|
|
+ <div style="overflow-x: scroll;">
|
|
|
+ <el-radio-group size="large">
|
|
|
+ <el-radio-button label="New York" />
|
|
|
+ <el-radio-button label="Washington" />
|
|
|
+ <el-radio-button label="Los Angeles"/>
|
|
|
+ <el-radio-button label="Chicago"/>
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
+ <div style="border-bottom: 1px solid #e5e7eb;" class="selectedDiv">
|
|
|
+ <span> </span>
|
|
|
+ <el-row :gutter="10" class="mb8">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="2. 标题:" required>
|
|
|
+ <el-input readonly style="width: 100%;" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="2" align="center">
|
|
|
+ <el-checkbox label="是否必填"/>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="3">
|
|
|
+ <el-select v-model="queryParams.gender" placeholder="请选择" clearable >
|
|
|
+ <el-option v-for="dict in [{ label: '横向排列', value: '1' }, { label: '竖向排列', value: '2' }]"
|
|
|
+ :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="3" >
|
|
|
+ <div>
|
|
|
+ <el-select v-model="queryParams.gender" placeholder="请选择" clearable>
|
|
|
+ <el-option v-for="dict in [{ label: '横向排列', value: '1' }, { label: '竖向排列', value: '2' }]"
|
|
|
+ :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="10" class="mb8" style="background-color: #e5e7eb;height: 40px;line-height: 40px;">
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="text-align: center;">选项(单选)</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="2">
|
|
|
+ <div style="text-align: center;">添加图片</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="3">
|
|
|
+ <div style="text-align: center;">分值设置</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="3" >
|
|
|
+ <div style="text-align: left;">允许填空</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6" >
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="10" class="mb8" style="margin-top: 20px;">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item required>
|
|
|
+ <el-radio-group>
|
|
|
+ <el-radio :disabled="true" >
|
|
|
+ 选项1:
|
|
|
+ <el-input readonly size="large" style="width: 500px;">
|
|
|
+ <template #append><el-button>-</el-button></template>
|
|
|
+ </el-input>
|
|
|
+ </el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="2" align="center" style="margin-top: -5px;">
|
|
|
+ <miniImageUpload :limit="1"/>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="3" align="center">
|
|
|
+ <el-input style="width: 60px;height: 30px;" value="1" size="small" />
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1" align="center">
|
|
|
+ <el-checkbox/>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" align="center">
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <div style="display: flex; align-items: right;justify-content: right;padding-right: 50px;">
|
|
|
+ <el-button type="primary" icon="Top" plain>上移</el-button>
|
|
|
+ <el-button type="primary" icon="Bottom" plain>下移</el-button>
|
|
|
+ <el-button type="primary" icon="Upload" plain>置顶</el-button>
|
|
|
+ <el-button type="primary" icon="Download" plain>置底</el-button>
|
|
|
+ <el-button type="primary" icon="Delete" plain>删除</el-button>
|
|
|
+ </div>
|
|
|
+ <span> </span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </el-scrollbar>
|
|
|
+ </el-main>
|
|
|
+ </el-container>
|
|
|
+ </el-container>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup name="ScreeningAssessmentConfig" lang="ts">
|
|
|
+import { ref, onMounted, onUnmounted } from 'vue';
|
|
|
+import { listScreeningAssessmentConfig, getScreeningAssessmentConfig, delScreeningAssessmentConfig, addScreeningAssessmentConfig, updateScreeningAssessmentConfig } from '@/api/system/screeningAssessmentConfig';
|
|
|
+import { ScreeningAssessmentConfigVO, ScreeningAssessmentConfigQuery, ScreeningAssessmentConfigForm, QuestionAttrVO, QuestionVO } from '@/api/system/screeningAssessmentConfig/types';
|
|
|
+import { fa, tr } from 'element-plus/es/locale/index.mjs';
|
|
|
+import { Document } from '@element-plus/icons-vue';
|
|
|
+
|
|
|
+const showSystemParam = ref(true);
|
|
|
+const showQuestionType = ref(true);
|
|
|
+
|
|
|
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
|
|
+const { scale_type } = toRefs<any>(proxy?.useDict('scale_type'));
|
|
|
+
|
|
|
+const screeningAssessmentConfigList = ref<ScreeningAssessmentConfigVO[]>([]);
|
|
|
+const buttonLoading = ref(false);
|
|
|
+const loading = ref(true);
|
|
|
+const showSearch = ref(true);
|
|
|
+const ids = ref<Array<string | number>>([]);
|
|
|
+const single = ref(true);
|
|
|
+const multiple = ref(true);
|
|
|
+const total = ref(0);
|
|
|
+
|
|
|
+const baseInfo = ref<QuestionVO>({
|
|
|
+ questionId: '',
|
|
|
+ title: '',
|
|
|
+ questionType: '',
|
|
|
+ content: '',
|
|
|
+ selected: false,
|
|
|
+ contentList: [],
|
|
|
+});
|
|
|
+const otherInfo = ref<QuestionVO[]>([]);
|
|
|
+const questionType = ref<QuestionVO[]>([]);
|
|
|
+
|
|
|
+const queryFormRef = ref<ElFormInstance>();
|
|
|
+const screeningAssessmentConfigFormRef = ref<ElFormInstance>();
|
|
|
+
|
|
|
+const dialog = reactive<DialogOption>({
|
|
|
+ visible: false,
|
|
|
+ title: ''
|
|
|
+});
|
|
|
+
|
|
|
+const initFormData: ScreeningAssessmentConfigForm = {
|
|
|
+ configId: undefined,
|
|
|
+ type: '1',
|
|
|
+ gender: '-1',
|
|
|
+ age: '-1',
|
|
|
+ name: undefined,
|
|
|
+ description: undefined,
|
|
|
+ remark: undefined,
|
|
|
+ status: undefined,
|
|
|
+}
|
|
|
+const data = reactive<PageData<ScreeningAssessmentConfigForm, ScreeningAssessmentConfigQuery>>({
|
|
|
+ form: { ...initFormData },
|
|
|
+ queryParams: {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ type: undefined,
|
|
|
+ gender: undefined,
|
|
|
+ age: undefined,
|
|
|
+ name: undefined,
|
|
|
+ description: undefined,
|
|
|
+ status: undefined,
|
|
|
+ params: {
|
|
|
+ }
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ configId: [
|
|
|
+ { required: true, message: "主键ID不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ type: [
|
|
|
+ { required: true, message: "量表类型不能为空", trigger: "change" }
|
|
|
+ ],
|
|
|
+ name: [
|
|
|
+ { required: true, message: "量表名称不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+const { queryParams, form, rules } = toRefs(data);
|
|
|
+
|
|
|
+/** 查询筛查/评估配置列表 */
|
|
|
+const getList = async () => {
|
|
|
+ loading.value = true;
|
|
|
+ const res = await listScreeningAssessmentConfig(queryParams.value);
|
|
|
+ screeningAssessmentConfigList.value = res.rows;
|
|
|
+ total.value = res.total;
|
|
|
+ loading.value = false;
|
|
|
+}
|
|
|
+
|
|
|
+/** 取消按钮 */
|
|
|
+const cancel = () => {
|
|
|
+ reset();
|
|
|
+ dialog.visible = false;
|
|
|
+}
|
|
|
+
|
|
|
+/** 表单重置 */
|
|
|
+const reset = () => {
|
|
|
+ form.value = { ...initFormData };
|
|
|
+ screeningAssessmentConfigFormRef.value?.resetFields();
|
|
|
+}
|
|
|
+
|
|
|
+/** 搜索按钮操作 */
|
|
|
+const handleQuery = () => {
|
|
|
+ queryParams.value.pageNum = 1;
|
|
|
+ getList();
|
|
|
+}
|
|
|
+
|
|
|
+/** 重置按钮操作 */
|
|
|
+const resetQuery = () => {
|
|
|
+ queryFormRef.value?.resetFields();
|
|
|
+ handleQuery();
|
|
|
+}
|
|
|
+
|
|
|
+/** 多选框选中数据 */
|
|
|
+const handleSelectionChange = (selection: ScreeningAssessmentConfigVO[]) => {
|
|
|
+ ids.value = selection.map(item => item.configId);
|
|
|
+ single.value = selection.length != 1;
|
|
|
+ multiple.value = !selection.length;
|
|
|
+}
|
|
|
+
|
|
|
+/** 新增按钮操作 */
|
|
|
+const handleAdd = () => {
|
|
|
+ reset();
|
|
|
+ dialog.visible = true;
|
|
|
+ dialog.title = "添加筛查/评估配置";
|
|
|
+}
|
|
|
+
|
|
|
+/** 修改按钮操作 */
|
|
|
+const handleUpdate = async (row?: ScreeningAssessmentConfigVO) => {
|
|
|
+ reset();
|
|
|
+ const _configId = row?.configId || ids.value[0]
|
|
|
+ const res = await getScreeningAssessmentConfig(_configId);
|
|
|
+ Object.assign(form.value, res.data);
|
|
|
+ dialog.visible = true;
|
|
|
+ dialog.title = "修改筛查/评估配置";
|
|
|
+}
|
|
|
+
|
|
|
+/** 提交按钮 */
|
|
|
+const submitForm = () => {
|
|
|
+ screeningAssessmentConfigFormRef.value?.validate(async (valid: boolean) => {
|
|
|
+ if (valid) {
|
|
|
+ buttonLoading.value = true;
|
|
|
+ if (form.value.configId) {
|
|
|
+ await updateScreeningAssessmentConfig(form.value).finally(() => buttonLoading.value = false);
|
|
|
+ } else {
|
|
|
+ await addScreeningAssessmentConfig(form.value).finally(() => buttonLoading.value = false);
|
|
|
+ }
|
|
|
+ proxy?.$modal.msgSuccess("操作成功");
|
|
|
+ dialog.visible = false;
|
|
|
+ await getList();
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+/** 删除按钮操作 */
|
|
|
+const handleDelete = async (row?: ScreeningAssessmentConfigVO) => {
|
|
|
+ const _configIds = row?.configId || ids.value;
|
|
|
+ await proxy?.$modal.confirm('是否确认删除筛查/评估配置编号为"' + _configIds + '"的数据项?').finally(() => loading.value = false);
|
|
|
+ await delScreeningAssessmentConfig(_configIds);
|
|
|
+ proxy?.$modal.msgSuccess("删除成功");
|
|
|
+ await getList();
|
|
|
+}
|
|
|
+
|
|
|
+/** 导出按钮操作 */
|
|
|
+const handleExport = () => {
|
|
|
+ proxy?.download('system/screeningAssessmentConfig/export', {
|
|
|
+ ...queryParams.value
|
|
|
+ }, `screeningAssessmentConfig_${new Date().getTime()}.xlsx`)
|
|
|
+}
|
|
|
+
|
|
|
+/** 预览按钮操作 */
|
|
|
+const handlePreview = () => {
|
|
|
+ // Implementation of handlePreview function
|
|
|
+}
|
|
|
+
|
|
|
+/** 关闭按钮操作 */
|
|
|
+const close = () => {
|
|
|
+ // Implementation of close function
|
|
|
+}
|
|
|
+
|
|
|
+function handleOtherBtnClick(nameEn: string, nameCn: string) {
|
|
|
+ let question: QuestionVO = {
|
|
|
+ questionId: '',
|
|
|
+ title: nameCn,
|
|
|
+ questionType: 'otherInfo',
|
|
|
+ content: '',
|
|
|
+ contentList: [],
|
|
|
+ };
|
|
|
+ otherInfo.value.push(question);
|
|
|
+
|
|
|
+ if ('anthropometry' == nameEn) {
|
|
|
+ question.contentList.push({
|
|
|
+ label: '身高',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'height',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '当前体重',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'currentWeight',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '出生体重',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'birthWeight',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '理想体重',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'idealWeight',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: 'BMI',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'BMI',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '握力',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'gripStrength',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '皮褶厚度',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'leatherFoldThickness',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '腰围',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'waistCircumference',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '上臂围',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'upperArmCircumference',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '小腿围',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'calfCircumference',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '其他测量指标',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'otherMeasurementIndicators',
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ question = {
|
|
|
+ questionId: '',
|
|
|
+ title: '请选择调查时间',
|
|
|
+ questionType: 'otherInfo',
|
|
|
+ content: '',
|
|
|
+ contentList: [],
|
|
|
+ };
|
|
|
+ otherInfo.value.push(question);
|
|
|
+ question.contentList.push({
|
|
|
+ label: '三个月前',
|
|
|
+ formType: 'radio',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'threeMonthsAgo',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '两个月前',
|
|
|
+ value: undefined,
|
|
|
+ formType: 'radio',
|
|
|
+ nameEn: 'twoMonthsAgo',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '一个月前',
|
|
|
+ formType: 'radio',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'oneMonthsAgo',
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ question = {
|
|
|
+ questionId: '',
|
|
|
+ title: '请填入已选调查时间体重',
|
|
|
+ questionType: 'otherInfo',
|
|
|
+ content: '',
|
|
|
+ contentList: [],
|
|
|
+ };
|
|
|
+ otherInfo.value.push(question);
|
|
|
+ question.contentList.push({
|
|
|
+ label: '过去体重',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'pastWeight',
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ question = {
|
|
|
+ questionId: '',
|
|
|
+ title: '1-3个月内体重变化情况',
|
|
|
+ questionType: 'otherInfo',
|
|
|
+ content: '',
|
|
|
+ contentList: [],
|
|
|
+ };
|
|
|
+ otherInfo.value.push(question);
|
|
|
+ question.contentList.push({
|
|
|
+ label: '近3个月体重无显著变化',
|
|
|
+ formType: 'radioScore',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'noChangeWeight',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '近3个月体重丢失>5%',
|
|
|
+ formType: 'radioScore',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'weightLoss5In3Months',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '近2个月体重丢失>5%',
|
|
|
+ formType: 'radioScore',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'weightLoss5In2Months',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '近1个月体重丢失>5%',
|
|
|
+ formType: 'radioScore',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'weightLoss5In1Months',
|
|
|
+ });
|
|
|
+
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ if ('dietaryStatus' == nameEn) {
|
|
|
+ question.contentList.push({
|
|
|
+ label: '平素膳食餐次',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'regularMealSchedule',
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ question = {
|
|
|
+ questionId: '',
|
|
|
+ title: '近1周食物摄入量是否减少',
|
|
|
+ questionType: 'otherInfo',
|
|
|
+ content: '',
|
|
|
+ contentList: [],
|
|
|
+ };
|
|
|
+ otherInfo.value.push(question);
|
|
|
+ question.contentList.push({
|
|
|
+ label: '无变化',
|
|
|
+ formType: 'radioScore',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'noChange',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '较从前减少25%~50%',
|
|
|
+ formType: 'radioScore',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'decreasedBy25To50',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '较从前减少51%~75%',
|
|
|
+ formType: 'radioScore',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'decreasedBy51To75',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '较从前减少76%~100%',
|
|
|
+ formType: 'radioScore',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'decreasedBy76To100',
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ question = {
|
|
|
+ questionId: '',
|
|
|
+ title: '近1周食物摄入种类(/日)',
|
|
|
+ questionType: 'otherInfo',
|
|
|
+ content: '',
|
|
|
+ contentList: [],
|
|
|
+ };
|
|
|
+ otherInfo.value.push(question);
|
|
|
+ question.contentList.push({
|
|
|
+ label: '奶及奶制品',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'milkAndDairyProducts',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '坚果类',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'nutCategory',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '大豆类',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'largeBeans',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '肉蛋水产类',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'meatEggAndAquaticProducts',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '蔬菜类',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'vegetables',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '水果类',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'fruitCategory',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '谷薯杂豆类',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'grainPotatoAndMixedBeans',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '调料类',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'seasoning',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '水',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'water',
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ question = {
|
|
|
+ questionId: '',
|
|
|
+ title: '近1周能量-营养素摄入分析(/日)',
|
|
|
+ questionType: 'otherInfo',
|
|
|
+ content: '',
|
|
|
+ contentList: [],
|
|
|
+ };
|
|
|
+ otherInfo.value.push(question);
|
|
|
+ question.contentList.push({
|
|
|
+ label: '总能量',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'totalEnergy',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '总氮量',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'totalNitrogenContent',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '氮/能量比值:1',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'nitrogenEnergyRatio1',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '蛋白质含量',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'proteinContent',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '脂肪含量',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'fatContent',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '碳水化合物含量',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'carbohydrateContent',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '蛋白质热比',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'proteinHeatRatio',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '脂肪热比',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'protefatToHeatRatioinHeatRatio',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '碳水化合物热比',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'carbohydrateHeatRatio',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '盐',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'salt',
|
|
|
+ });
|
|
|
+ question.contentList.push({
|
|
|
+ label: '钠',
|
|
|
+ value: undefined,
|
|
|
+ nameEn: 'sodium',
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+function handleBaseBtnClick(nameEn: string, nameCn: string) {
|
|
|
+ if (baseInfo.value.contentList.length < 1) {
|
|
|
+ baseInfo.value.title = '基本信息';
|
|
|
+ baseInfo.value.questionType = 'baseInfo';
|
|
|
+ baseInfo.value.contentList = [];
|
|
|
+ }
|
|
|
+
|
|
|
+ let questionAttr: QuestionAttrVO = {
|
|
|
+ label: nameCn,
|
|
|
+ value: undefined,
|
|
|
+ nameEn: nameEn,
|
|
|
+ };
|
|
|
+
|
|
|
+ if (baseInfo.value.contentList.length < 1) {
|
|
|
+ baseInfo.value.contentList.push(questionAttr);
|
|
|
+ } else {
|
|
|
+ let existed = false;
|
|
|
+ for (let item of baseInfo.value.contentList) {
|
|
|
+ if (item.nameEn == nameEn) {
|
|
|
+ existed = true;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!existed) {
|
|
|
+ baseInfo.value.contentList.push(questionAttr);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+function handleBaseBtnDelete(nameEn: string) {
|
|
|
+ let contentList = [];
|
|
|
+ for (let item of baseInfo.value.contentList) {
|
|
|
+ if (item.nameEn != nameEn) {
|
|
|
+ contentList.push(item);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ if (contentList.length < 1) {
|
|
|
+ baseInfo.value.questionType = undefined;
|
|
|
+ baseInfo.value.contentList = [];
|
|
|
+ } else {
|
|
|
+ baseInfo.value.contentList = contentList;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function deleteBaseInfo() {
|
|
|
+ baseInfo.value.contentList = [];
|
|
|
+ baseInfo.value.questionType = undefined;
|
|
|
+}
|
|
|
+
|
|
|
+function deleteOtherInfo(index: number) {
|
|
|
+ let newList = []
|
|
|
+ for (let i = 0, len = otherInfo.value.length; i < len; i++) {
|
|
|
+ if (i == index) {
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+ newList.push(otherInfo.value[i]);
|
|
|
+ }
|
|
|
+ otherInfo.value = newList;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+function selectBaseInfo() {
|
|
|
+ baseInfo.value.selected = true;
|
|
|
+ otherInfo.value.forEach(item => {
|
|
|
+ item.selected = false;
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+function selectOtherInfo(index: number) {
|
|
|
+ baseInfo.value.selected = false;
|
|
|
+ otherInfo.value.forEach(item => {
|
|
|
+ item.selected = false;
|
|
|
+ });
|
|
|
+ let other = otherInfo.value[index]
|
|
|
+ other.selected = true;
|
|
|
+}
|
|
|
+
|
|
|
+const bodyWidth = ref((window.document.body.clientWidth - 500) * 0.8);
|
|
|
+function updateBodyWidth() {
|
|
|
+ let leftPanel = window.document.querySelector('#leftPanel').clientWidth;
|
|
|
+ bodyWidth.value = (window.document.body.clientWidth - leftPanel) * 0.93;
|
|
|
+}
|
|
|
+onMounted(() => {
|
|
|
+ window.addEventListener('resize', updateBodyWidth);
|
|
|
+ updateBodyWidth();
|
|
|
+});
|
|
|
+onUnmounted(() => {
|
|
|
+ window.removeEventListener('resize', updateBodyWidth);
|
|
|
+});
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.layout-container-demo .el-header {
|
|
|
+ position: relative;
|
|
|
+ background-color: var(--el-color-primary-light-7);
|
|
|
+ color: var(--el-text-color-primary);
|
|
|
+}
|
|
|
+
|
|
|
+.layout-container-demo .el-aside {
|
|
|
+ color: var(--el-text-color-primary);
|
|
|
+ background: var(--el-color-primary-light-8);
|
|
|
+}
|
|
|
+
|
|
|
+.layout-container-demo .el-menu {
|
|
|
+ border-right: none;
|
|
|
+}
|
|
|
+
|
|
|
+.layout-container-demo .el-main {
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.layout-container-demo .toolbar {
|
|
|
+ display: inline-flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ height: 100%;
|
|
|
+ right: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.param-btn {
|
|
|
+ width: 100%;
|
|
|
+ height: 48px;
|
|
|
+ font-size: 13px;
|
|
|
+ font-weight: normal;
|
|
|
+ border: 1.5px solid #bfcbd9;
|
|
|
+ border-radius: 4px;
|
|
|
+ margin-bottom: 16px;
|
|
|
+ background: #fff;
|
|
|
+ color: #222;
|
|
|
+ letter-spacing: 1px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ text-align: center;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ padding: 0 2px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 1200px) {
|
|
|
+ .param-btn {
|
|
|
+ font-size: 13px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 800px) {
|
|
|
+ .param-btn {
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.selectedDiv {
|
|
|
+ background-color: #e8f4ff;
|
|
|
+}
|
|
|
+
|
|
|
+ul .el-upload--picture-card{
|
|
|
+ --el-upload-picture-card-size:500px
|
|
|
+}
|
|
|
+</style>
|