update
init
This commit is contained in:
@@ -0,0 +1,161 @@
|
||||
<template>
|
||||
<BasicModal @register="registerModal" title="员工健康档案维护" width="90%" :footer="false" @cancel="handleCancel">
|
||||
<div class="outer">
|
||||
<div class="user-info">
|
||||
<img :src="userUrl" alt="" class="user-avatar" />
|
||||
<div class="user-info-content">
|
||||
<div class="user-info-content-item">
|
||||
<span>单位：</span>
|
||||
<span>{{ userInfo?.secondDepart }}</span>
|
||||
</div>
|
||||
<div class="user-info-content-item">
|
||||
<span>部门：</span>
|
||||
<span>{{ userInfo?.thirdDepart }}</span>
|
||||
</div>
|
||||
<div class="user-info-content-item user-basic-info">
|
||||
<p>
|
||||
<span>姓名：</span>
|
||||
<span>{{ userInfo?.realname }}</span>
|
||||
</p>
|
||||
<p>
|
||||
<span>性别：</span>
|
||||
<span>{{ userInfo?.sex_dictText }}</span>
|
||||
</p>
|
||||
<p>
|
||||
<span>年龄：</span>
|
||||
<span>{{ userInfo?.age }}</span>
|
||||
</p>
|
||||
<p>
|
||||
<span>职位：</span>
|
||||
<span>{{ userInfo?.empJob_dictText }}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div style="width: 200px">
|
||||
<a-tabs v-model:activeKey="activeKey" :tab-position="mode" :style="{ height: '100%' }">
|
||||
<a-tab-pane v-for="(item, index) in tabPane" :key="index" :tab="`${index + 1}、${item}`"></a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
<div style="width: calc(100% - 200px); padding: 0 10px; height: 100%; overflow: auto; display: flex; flex-direction: column">
|
||||
<div class="right-top-title">{{ tabPane[activeKey] }} </div>
|
||||
<!-- 1、基本信息 -->
|
||||
<Tab1 :userInfo="userInfo" v-if="userInfo && activeKey == 0" />
|
||||
<!-- 2、健康现状 -->
|
||||
<Tab2 :userInfo="userInfo" v-if="userInfo && activeKey == 1" />
|
||||
<!-- 3、基本体格 -->
|
||||
<Tab3 :userInfo="userInfo" v-if="userInfo && activeKey == 2" />
|
||||
<!-- 4、健康检查 -->
|
||||
<Tab4 :userInfo="userInfo" v-if="userInfo && activeKey == 3" />
|
||||
<!-- 5、个人病史 -->
|
||||
<Tab5 :userInfo="userInfo" v-if="userInfo && activeKey == 4" />
|
||||
<!-- 5、家族病史 -->
|
||||
<Tab6 :userInfo="userInfo" v-if="userInfo && activeKey == 5" />
|
||||
<!-- 8、运动情况-->
|
||||
<Tab8 :userInfo="userInfo" v-if="userInfo && activeKey == 7" />
|
||||
<!-- 9、吸烟饮酒-->
|
||||
<Tab9 :userInfo="userInfo" v-if="userInfo && activeKey == 8" />
|
||||
<!-- 10、睡眠情况-->
|
||||
<Tab10 :userInfo="userInfo" v-if="userInfo && activeKey == 9" />
|
||||
<!-- 12、健康评估-->
|
||||
<Tab12 :userInfo="userInfo" v-if="userInfo && activeKey == 11" />
|
||||
<!-- 15、心理压力-->
|
||||
<Tab15 :userInfo="userInfo" v-if="userInfo && activeKey == 14" />
|
||||
<!-- 16、疫苗接种-->
|
||||
<Tab16 :userInfo="userInfo" v-if="userInfo && activeKey == 15" />
|
||||
<a-empty v-if="[6, 10, 12, 13, 16, 17].includes(activeKey)">
|
||||
<template #description> 开发中，敬请期待... </template>
|
||||
</a-empty>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { tabPane } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { getFileAccessHttpUrl, getFamaleDefaultImage } from '/@/utils/common/compUtils';
|
||||
import Tab1 from '/@/views/archivesManage/employee/fileMaintenance/components/tab1.vue';
|
||||
import Tab2 from '/@/views/archivesManage/employee/fileMaintenance/components/tab2.vue';
|
||||
import Tab3 from '/@/views/archivesManage/employee/fileMaintenance/components/tab3.vue';
|
||||
import Tab4 from '/@/views/archivesManage/employee/fileMaintenance/components/tab4.vue';
|
||||
import Tab5 from '/@/views/archivesManage/employee/fileMaintenance/components/tab5.vue';
|
||||
import Tab6 from '/@/views/archivesManage/employee/fileMaintenance/components/tab6.vue';
|
||||
import Tab8 from '/@/views/archivesManage/employee/fileMaintenance/components/tab8.vue';
|
||||
import Tab9 from '/@/views/archivesManage/employee/fileMaintenance/components/tab9.vue';
|
||||
import Tab10 from '/@/views/archivesManage/employee/fileMaintenance/components/tab10.vue';
|
||||
import Tab16 from '/@/views/archivesManage/employee/fileMaintenance/components/tab16.vue';
|
||||
import Tab15 from '/@/views/archivesManage/employee/fileMaintenance/components/tab15.vue';
|
||||
import Tab12 from '/@/views/archivesManage/employee/fileMaintenance/components/tab12.vue';
|
||||
const userInfo = ref();
|
||||
const userUrl = ref();
|
||||
const emit = defineEmits(['success']);
|
||||
|
||||
const [registerModal, { closeModal }] = useModalInner((data) => {
|
||||
activeKey.value = 0;
|
||||
userInfo.value = data.record;
|
||||
userUrl.value = data.record?.avatar ? getFileAccessHttpUrl(data.record?.avatar) : getFamaleDefaultImage();
|
||||
});
|
||||
const activeKey = ref(0);
|
||||
const mode = ref('left');
|
||||
onMounted(() => {
|
||||
activeKey.value = 0;
|
||||
});
|
||||
function handleCancel() {
|
||||
emit('success');
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.outer {
|
||||
flex-wrap: wrap;
|
||||
flex-direction: column;
|
||||
height: calc(75vh - 60px);
|
||||
}
|
||||
.user-info {
|
||||
width: 100%;
|
||||
border-bottom: 1px dashed #999;
|
||||
display: flex;
|
||||
padding: 10px;
|
||||
height: 120px;
|
||||
.user-avatar {
|
||||
display: inline-block;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.user-info-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
margin-left: 10px;
|
||||
.user-basic-info {
|
||||
display: flex;
|
||||
p {
|
||||
margin-right: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.content {
|
||||
height: calc(100% - 120px);
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex: 1;
|
||||
.right-top-title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
margin: 10px;
|
||||
}
|
||||
:deep(.ant-tabs-nav) {
|
||||
width: 200px !important;
|
||||
}
|
||||
:deep(.ant-tabs-tab-active) {
|
||||
background: #e6f7ff;
|
||||
color: #5087ec;
|
||||
}
|
||||
> div {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,113 @@
|
||||
<template>
|
||||
<div style="position: relative">
|
||||
<a-row>
|
||||
<a-col :span="9">
|
||||
<BasicForm @register="registerForm"></BasicForm>
|
||||
</a-col>
|
||||
<a-col :span="11">
|
||||
<div class="holder-box" v-for="(item, index) in FieldHolder" :key="index">
|
||||
{{ item ? `(${item})` : '' }}
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="4" style="text-align: center">
|
||||
<BasicForm @register="registerForm2"></BasicForm>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-button type="primary" style="position: absolute; right: 10px; bottom: 10px" @click="handleOk" v-if="props.editType !== '1'">保存</a-button>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import BasicForm from '/@/components/Form/src/BasicForm.vue';
|
||||
import { useForm } from '/@/components/Form';
|
||||
import { formSchema, FieldHolder, formSchemaAvater } from '/@/views/archivesManage/employee/basicInfo/basicInfo.data';
|
||||
import { userInfoEditApi } from '/@/views/information/employeeInformation/basicInformation/database/database.api';
|
||||
import { onMounted, watch } from 'vue';
|
||||
const emit = defineEmits();
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
editType: {
|
||||
type: String,
|
||||
default: () => '0',
|
||||
},
|
||||
});
|
||||
onMounted(async () => {
|
||||
console.log(props.userInfo, '123333');
|
||||
if (Object.keys(props.userInfo).length > 0) {
|
||||
await setFieldsValue({ ...props.userInfo });
|
||||
await setFieldsValue({
|
||||
orgCode1: props.userInfo.orgCode.substring(0, 6),
|
||||
idCardFind: props.userInfo.idCard,
|
||||
orgCodeThree: props.userInfo.orgCode,
|
||||
});
|
||||
await setAvaterFieldsValue({ avatar: props.userInfo.avatar });
|
||||
await clearValidate();
|
||||
await clearAvaterValidate();
|
||||
}
|
||||
if (props.editType === '1') {
|
||||
await setProps({ disabled: true });
|
||||
}
|
||||
});
|
||||
watch(
|
||||
() => props.userInfo,
|
||||
async () => {
|
||||
await setFieldsValue({ ...props.userInfo });
|
||||
await setFieldsValue({
|
||||
orgCode1: props.userInfo.orgCode.substring(0, 6),
|
||||
orgCodeThree: props.userInfo.orgCode,
|
||||
idCardFind: props.userInfo.idCard,
|
||||
});
|
||||
await setAvaterFieldsValue({ avatar: props.userInfo.avatar });
|
||||
await clearValidate();
|
||||
await clearAvaterValidate();
|
||||
}
|
||||
);
|
||||
const [registerForm, { resetFields, setFieldsValue, validate, clearValidate, getFieldsValue, setProps }] = useForm({
|
||||
schemas: formSchema,
|
||||
showActionButtonGroup: false,
|
||||
labelWidth: 100,
|
||||
baseColProps: { span: 24 },
|
||||
});
|
||||
const [
|
||||
registerForm2,
|
||||
{
|
||||
resetFields: resetAvaterFields,
|
||||
setFieldsValue: setAvaterFieldsValue,
|
||||
validate: validateAvater,
|
||||
clearValidate: clearAvaterValidate,
|
||||
getFieldsValue: getAvaterFieldsValue,
|
||||
},
|
||||
] = useForm({
|
||||
schemas: formSchemaAvater,
|
||||
showActionButtonGroup: false,
|
||||
baseColProps: { span: 24 },
|
||||
});
|
||||
|
||||
async function handleOk() {
|
||||
try {
|
||||
const value = await validate();
|
||||
const value1 = await validateAvater();
|
||||
if (value.idCard.indexOf('*') != -1) {
|
||||
delete value.idCard;
|
||||
}
|
||||
|
||||
const params = {
|
||||
...value,
|
||||
...value1,
|
||||
};
|
||||
console.log(params);
|
||||
await userInfoEditApi(params);
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.holder-box {
|
||||
height: 52px;
|
||||
line-height: 32px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,43 @@
|
||||
<template>
|
||||
<div v-show="!showView">
|
||||
<a-radio-group v-model:value="heartType" button-style="solid" @change="hanldChange">
|
||||
<a-radio-button value="0">手表</a-radio-button>
|
||||
<a-radio-button value="1">问卷</a-radio-button>
|
||||
</a-radio-group>
|
||||
<Table1 v-if="heartType == '0'" :userInfo="props.userInfo"></Table1>
|
||||
<Table2 v-if="heartType == '1'" @go-detail="goDetail" :userInfo="props.userInfo"></Table2>
|
||||
</div>
|
||||
<Tab10Detail v-show="showView && info" :info="info" @go-back="goBack"></Tab10Detail>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import Table1 from '/@/views/archivesManage/employee/fileMaintenance/components/tab10/table1.vue';
|
||||
import Table2 from '/@/views/archivesManage/employee/fileMaintenance/components/tab10/table2.vue';
|
||||
import Tab10Detail from '/@/views/archivesManage/employee/fileMaintenance/components/tab10/tab10Detail.vue';
|
||||
const heartType = ref('0');
|
||||
const showView = ref(false);
|
||||
const info = ref();
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
function hanldChange() {
|
||||
// async function hanldChange() {
|
||||
// setColumns(tab15Column(heartType.value));
|
||||
// setProps({
|
||||
// api: heartType.value == '0' ? tab15ListApi : psychoList,
|
||||
// });
|
||||
// await reload();
|
||||
// }
|
||||
}
|
||||
function goDetail(record) {
|
||||
info.value = record;
|
||||
showView.value = true;
|
||||
console.log(record, 12322);
|
||||
}
|
||||
function goBack() {
|
||||
showView.value = false;
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="title">
|
||||
<a-button type="primary" @click="goBack" class="addBtn">返回</a-button>
|
||||
</div>
|
||||
<div class="sleep">
|
||||
<div>{{ info?.surveyName }}</div>
|
||||
<div class="sleep-detail" v-for="(item, index) in info?.questionList" :key="index">
|
||||
<div class="label">{{ item.childrenQuestions[0].title }}</div>
|
||||
<div class="value" v-if="item.childrenQuestions[0].questionCode == 1"> {{ item.childrenQuestions[0].answer }} 小时 </div>
|
||||
<div class="value" v-if="item.childrenQuestions[0].questionCode == 2"> {{ getAnswer(2, item.childrenQuestions[0].answer) }} </div>
|
||||
<div class="value" v-if="item.childrenQuestions[0].questionCode == 3"> {{ getAnswer(3, item.childrenQuestions[0].answer) }} </div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const emit = defineEmits(['go-back']);
|
||||
const props = defineProps({
|
||||
info: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
function getAnswer(type, value) {
|
||||
if (type == 2) {
|
||||
switch (value) {
|
||||
case '0':
|
||||
return '很好';
|
||||
case '1':
|
||||
return '较好';
|
||||
case '2':
|
||||
return '较差';
|
||||
case '3':
|
||||
return '很差';
|
||||
}
|
||||
}
|
||||
if (type == 3) {
|
||||
switch (value) {
|
||||
case '0':
|
||||
return '无';
|
||||
case '1':
|
||||
return '< 1次/周';
|
||||
case '2':
|
||||
return '1-2次/周';
|
||||
case '3':
|
||||
return '≥3次/周';
|
||||
}
|
||||
}
|
||||
}
|
||||
function goBack() {
|
||||
emit('go-back');
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.sleep {
|
||||
margin: 20px;
|
||||
.sleep-detail {
|
||||
.label {
|
||||
font-weight: bold;
|
||||
margin: 20px 0;
|
||||
}
|
||||
.value {
|
||||
margin: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,168 @@
|
||||
<template>
|
||||
<div class="tab10-table1">
|
||||
<div class="top">
|
||||
<div class="top-left">
|
||||
<a-tabs v-model:activeKey="activeKey" @change="changeTabs">
|
||||
<a-tab-pane key="1" tab="全部"></a-tab-pane>
|
||||
<a-tab-pane key="2" tab="选时"></a-tab-pane>
|
||||
<a-tab-pane key="3" tab="日"></a-tab-pane>
|
||||
<a-tab-pane key="4" tab="周"></a-tab-pane>
|
||||
<a-tab-pane key="5" tab="月"></a-tab-pane>
|
||||
<a-tab-pane key="6" tab="季"></a-tab-pane>
|
||||
<a-tab-pane key="7" tab="年"></a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
</div>
|
||||
<div class="center" v-if="showPicker">
|
||||
<a-date-picker v-model:value="dateValue" :picker="pickerType" v-if="!showRangePicker" @change="changeDate" />
|
||||
|
||||
<a-range-picker v-model:value="rangeValue" v-if="showRangePicker" @change="changeRange" />
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<BasicTable @register="registerTable" table-type="1">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<div v-if="column.dataIndex == 'from'">穿戴设备</div>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import dayjs from 'dayjs';
|
||||
import { BasicTable } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { tab10List1Api } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import { tab10Column1 } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
const showRangePicker = ref(false);
|
||||
const pickerType = ref('');
|
||||
const dateValue = ref(dayjs(new Date()));
|
||||
const rangeValue = ref([dayjs(new Date().setDate(new Date().getDate() - 7)), dayjs(new Date())]);
|
||||
const showPicker = ref(false);
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
const activeKey = ref('1');
|
||||
const { tableContext } = useListPage({
|
||||
tableProps: {
|
||||
api: tab10List1Api,
|
||||
columns: tab10Column1,
|
||||
useSearchForm: false,
|
||||
showActionColumn: false,
|
||||
beforeFetch: (params) => {
|
||||
params.userId = props.userInfo?.id;
|
||||
return params;
|
||||
},
|
||||
},
|
||||
});
|
||||
const [registerTable, { reload, setProps }] = tableContext;
|
||||
function changeTabs() {
|
||||
showRangePicker.value = false;
|
||||
showPicker.value = true;
|
||||
switch (activeKey.value) {
|
||||
case '1':
|
||||
showPicker.value = false;
|
||||
break;
|
||||
case '2':
|
||||
showRangePicker.value = true;
|
||||
break;
|
||||
case '3':
|
||||
pickerType.value = '';
|
||||
break;
|
||||
case '4':
|
||||
pickerType.value = 'week';
|
||||
break;
|
||||
case '5':
|
||||
pickerType.value = 'month';
|
||||
break;
|
||||
case '6':
|
||||
pickerType.value = 'quarter';
|
||||
break;
|
||||
case '7':
|
||||
pickerType.value = 'year';
|
||||
break;
|
||||
}
|
||||
}
|
||||
function changeRange() {
|
||||
updataTable();
|
||||
}
|
||||
function changeDate() {
|
||||
updataTable();
|
||||
}
|
||||
function updataTable() {
|
||||
let startOfWeek;
|
||||
let endOfWeek;
|
||||
if (activeKey.value == '1') {
|
||||
startOfWeek = '';
|
||||
endOfWeek = '';
|
||||
} else if (activeKey.value == '2') {
|
||||
startOfWeek = rangeValue.value ? rangeValue.value[0].format('YYYY-MM-DD') : '';
|
||||
endOfWeek = rangeValue.value ? rangeValue.value[1].format('YYYY-MM-DD') : '';
|
||||
} else {
|
||||
switch (activeKey.value) {
|
||||
case '3':
|
||||
startOfWeek = dayjs(dateValue.value).startOf('day').format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(dateValue.value).endOf('day').format('YYYY-MM-DD');
|
||||
break;
|
||||
case '4':
|
||||
startOfWeek = dayjs(dateValue.value).startOf('week').format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(dateValue.value).endOf('week').format('YYYY-MM-DD');
|
||||
break;
|
||||
case '5':
|
||||
startOfWeek = dayjs(dateValue.value).startOf('month').format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(dateValue.value).endOf('month').format('YYYY-MM-DD');
|
||||
break;
|
||||
case '6':
|
||||
const quarter = dayjs(dateValue.value).quarter();
|
||||
if (quarter === 1) {
|
||||
startOfWeek = dayjs(`${dayjs(dateValue.value).year()}-01-01`).format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(`${dayjs(dateValue.value).year()}-03-31`).format('YYYY-MM-DD');
|
||||
} else if (quarter === 2) {
|
||||
startOfWeek = dayjs(`${dayjs(dateValue.value).year()}-04-01`).format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(`${dayjs(dateValue.value).year()}-06-30`).format('YYYY-MM-DD');
|
||||
} else if (quarter === 3) {
|
||||
startOfWeek = dayjs(`${dayjs(dateValue.value).year()}-07-01`).format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(`${dayjs(dateValue.value).year()}-09-30`).format('YYYY-MM-DD');
|
||||
} else if (quarter === 4) {
|
||||
startOfWeek = dayjs(`${dayjs(dateValue.value).year()}-10-01`).format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(`${dayjs(dateValue.value).year()}-12-31`).format('YYYY-MM-DD');
|
||||
}
|
||||
// startOfWeek = dayjs(dateValue.value).startOf('quarter').format('YYYY-MM-DD');
|
||||
// endOfWeek = dayjs(dateValue.value).endOf('quarter').format('YYYY-MM-DD');
|
||||
break;
|
||||
case '7':
|
||||
startOfWeek = dayjs(dateValue.value).startOf('year').format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(dateValue.value).endOf('year').format('YYYY-MM-DD');
|
||||
break;
|
||||
}
|
||||
}
|
||||
setProps({
|
||||
beforeFetch: (parmas) => {
|
||||
parmas.userId = props.userInfo?.id;
|
||||
parmas.startTime = startOfWeek;
|
||||
parmas.endTime = endOfWeek;
|
||||
return parmas;
|
||||
},
|
||||
});
|
||||
reload({ page: 1 });
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.tab10-table1 {
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.top-left {
|
||||
:deep(.ant-tabs-nav) {
|
||||
width: 100% !important;
|
||||
}
|
||||
:deep(.ant-tabs-tab-active) {
|
||||
background: #fff !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,42 @@
|
||||
<template>
|
||||
<div>
|
||||
<BasicTable @register="registerTable" table-type="1">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<div v-if="column.dataIndex == 'detail'">
|
||||
<a-button type="link" @click="handleDetail(record)">问卷内容</a-button>
|
||||
<!-- answerContent -->
|
||||
</div>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { BasicTable } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { tab10Column2 } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { tab10List2Api } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
const emit = defineEmits(['go-detail']);
|
||||
const { tableContext } = useListPage({
|
||||
tableProps: {
|
||||
api: tab10List2Api,
|
||||
columns: tab10Column2,
|
||||
useSearchForm: false,
|
||||
showActionColumn: false,
|
||||
beforeFetch: (params) => {
|
||||
params.userId = props.userInfo?.id;
|
||||
return params;
|
||||
},
|
||||
},
|
||||
});
|
||||
const [registerTable, { reload, setProps }] = tableContext;
|
||||
|
||||
function handleDetail(record) {
|
||||
emit('go-detail', record.answerContent);
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<div>
|
||||
<BasicTable @register="registerTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<div v-if="column.dataIndex == 'report'">
|
||||
<a-button type="link" @click="handleExportPdf(record)">下载报告</a-button>
|
||||
</div>
|
||||
<div v-if="column.dataIndex == 'detail'">
|
||||
<a-button type="link" @click="handleViewAnalysis(record)">问卷详情</a-button>
|
||||
</div>
|
||||
</template>
|
||||
</BasicTable>
|
||||
<Tab12Detail @register="registerDrawer" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { BasicTable } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
|
||||
import { tab12Column } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { tab12ListApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import { exportPDF } from '/@/views/archive/riskAssessmentStatistics/riskAssessmentStatistics.api';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
|
||||
import { useDrawer } from '/@/components/Drawer';
|
||||
import Tab12Detail from '/@/views/archivesManage/employee/fileMaintenance/components/tab12/tab12Detail.vue';
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
const { tableContext } = useListPage({
|
||||
tableProps: {
|
||||
api: tab12ListApi,
|
||||
columns: tab12Column,
|
||||
useSearchForm: false,
|
||||
formConfig: {},
|
||||
beforeFetch: (params) => {
|
||||
params.userId = props.userInfo.id;
|
||||
return params;
|
||||
},
|
||||
showActionColumn: false,
|
||||
},
|
||||
});
|
||||
const [registerTable, { reload, setColumns, setProps }] = tableContext;
|
||||
const [registerDrawer, { openDrawer }] = useDrawer();
|
||||
function handleViewAnalysis(record) {
|
||||
openDrawer(true, {
|
||||
record,
|
||||
userInfo: props.userInfo,
|
||||
isUpdate: true,
|
||||
showFooter: false,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 导出PDF
|
||||
* @param record
|
||||
*/
|
||||
async function handleExportPdf(record: Recordable) {
|
||||
try {
|
||||
const { code, result, message: info } = await exportPDF({ logId: record.logId });
|
||||
if (code !== 200) {
|
||||
message.warn(info || '导出失败');
|
||||
return;
|
||||
}
|
||||
const url = getFileAccessHttpUrl(result);
|
||||
if (url) {
|
||||
window.open(url);
|
||||
} else {
|
||||
message.warn(info || '获取文件地址失败');
|
||||
}
|
||||
} catch (e) {
|
||||
message.warn(e?.message || '导出失败');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<BasicDrawer v-bind="$attrs" :showFooter="false" @register="registerDrawer" destroyOnClose title="查看问卷详情" :width="700" :maskClosable="true">
|
||||
<a-descriptions v-if="Object.keys(descriptions).length > 0" title="HMS评估报告" bordered>
|
||||
<a-descriptions-item v-for="(item, k) in descriptions" :key="k" :label="k" :span="4">{{ item }}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
<a-empty v-else style="margin-top: 150px" />
|
||||
</BasicDrawer>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||
import { getQsDetail, QsDetail } from '/@/views/archive/riskAssessmentStatistics/riskAssessmentStatistics.api';
|
||||
|
||||
const descriptions = ref({});
|
||||
const userInfo = ref();
|
||||
//表单赋值
|
||||
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||
setDrawerProps({
|
||||
confirmLoading: false,
|
||||
showCancelBtn: !!data?.showFooter,
|
||||
showOkBtn: !!data?.showFooter,
|
||||
});
|
||||
descriptions.value = {};
|
||||
userInfo.value = data.userInfo;
|
||||
await getDetail(data.record);
|
||||
});
|
||||
async function getDetail(record: QsDetail) {
|
||||
try {
|
||||
const params = <QsDetail>{ logId: record.logId, realName: userInfo.value.realname, time: record.createTime };
|
||||
let res = await getQsDetail(params);
|
||||
if (res) {
|
||||
descriptions.value = res;
|
||||
}
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less"></style>
|
||||
@@ -0,0 +1,105 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-radio-group v-model:value="heartType" button-style="solid" @change="hanldChange">
|
||||
<a-radio-button value="0">心理健康</a-radio-button>
|
||||
<a-radio-button value="1">综合心理</a-radio-button>
|
||||
</a-radio-group>
|
||||
<BasicTable @register="registerTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<div v-if="column.dataIndex == 'report'">
|
||||
<a-button type="link" @click="handleExportPdf(record)">下载报告</a-button>
|
||||
</div>
|
||||
<div v-if="column.dataIndex == 'detail'">
|
||||
<a-button type="link" @click="handleViewAnalysis(record)">问卷详情</a-button>
|
||||
</div>
|
||||
</template>
|
||||
</BasicTable>
|
||||
<AnalysisReportModal @register="analysisReportModal" ref="reportModal"></AnalysisReportModal>
|
||||
<Tab15Detail @register="registerDrawer" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { BasicTable } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import AnalysisReportModal from '/@/views/interveneNew/psychology/selfdiagnosisAndJudgment/selfDiagnosis/components/analysisReportModal.vue';
|
||||
import { exportPDF } from '/@/views/archive/psychologicalAssessmentStatistics/psychologicalAssessmentStatistics.api';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { tab15Column } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { psychoList, tab15ListApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
|
||||
import { useDrawer } from '/@/components/Drawer';
|
||||
import Tab15Detail from '/@/views/archivesManage/employee/fileMaintenance/components/tab15/tab15Detail.vue';
|
||||
const heartType = ref('0');
|
||||
const [analysisReportModal, { openModal }] = useModal();
|
||||
const reportModal = ref(null);
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
const { tableContext } = useListPage({
|
||||
tableProps: {
|
||||
api: heartType.value == '0' ? tab15ListApi : psychoList,
|
||||
columns: tab15Column(heartType.value),
|
||||
useSearchForm: false,
|
||||
formConfig: {},
|
||||
beforeFetch: (params) => {
|
||||
params.userId = props.userInfo.id;
|
||||
return params;
|
||||
},
|
||||
showActionColumn: false,
|
||||
// canResize: false,
|
||||
// btnArr: ['add', 'edit', 'delete', 'export', 'print'],
|
||||
// formConfig: {
|
||||
// schemas: searchFormSchema,tab15ListApi
|
||||
// },
|
||||
},
|
||||
});
|
||||
const [registerTable, { reload, setColumns, setProps }] = tableContext;
|
||||
const [registerDrawer, { openDrawer }] = useDrawer();
|
||||
async function hanldChange() {
|
||||
setColumns(tab15Column(heartType.value));
|
||||
setProps({
|
||||
api: heartType.value == '0' ? tab15ListApi : psychoList,
|
||||
});
|
||||
await reload();
|
||||
}
|
||||
/**
|
||||
* 导出PDF报告
|
||||
* @param record
|
||||
*/
|
||||
async function handleExportPdf(record: Recordable) {
|
||||
try {
|
||||
const { code, result, message: info } = await exportPDF({ evaluationId: record.evaluationId });
|
||||
if (code !== 200) {
|
||||
message.warn(info || '导出失败');
|
||||
return;
|
||||
}
|
||||
const url = getFileAccessHttpUrl(result);
|
||||
if (url) {
|
||||
window.open(url);
|
||||
} else {
|
||||
message.warn(info || '获取文件地址失败');
|
||||
}
|
||||
} catch (e) {
|
||||
message.warn(e?.message || '导出失败');
|
||||
}
|
||||
}
|
||||
function handleViewAnalysis(record) {
|
||||
if (heartType.value == '0') {
|
||||
openDrawer(true, {
|
||||
record,
|
||||
userInfo: props.userInfo,
|
||||
isUpdate: true,
|
||||
showFooter: false,
|
||||
});
|
||||
} else {
|
||||
openModal(true, {
|
||||
record,
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<BasicDrawer v-bind="$attrs" :showFooter="false" @register="registerDrawer" destroyOnClose title="查看问卷详情" :width="700" :maskClosable="true">
|
||||
<a-descriptions v-if="Object.keys(descriptions).length > 0" title="HMS评估报告" bordered>
|
||||
<a-descriptions-item v-for="(item, k) in descriptions" :key="k" :label="k" :span="4">{{ item }}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
<a-empty v-else style="margin-top: 150px" />
|
||||
</BasicDrawer>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||
import { getQsDetail, QsDetail } from '/@/views/archive/psychologicalAssessmentStatistics/psychologicalAssessmentStatistics.api';
|
||||
|
||||
const descriptions = ref({});
|
||||
const userInfo = ref();
|
||||
//表单赋值
|
||||
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||
setDrawerProps({
|
||||
confirmLoading: false,
|
||||
showCancelBtn: !!data?.showFooter,
|
||||
showOkBtn: !!data?.showFooter,
|
||||
});
|
||||
descriptions.value = {};
|
||||
userInfo.value = data.userInfo;
|
||||
await getDetail(data.record);
|
||||
});
|
||||
async function getDetail(record: QsDetail) {
|
||||
try {
|
||||
const params = <QsDetail>{ evaluationId: record.evaluationId, realName: userInfo.value.realname, time: record.createTime };
|
||||
let res = await getQsDetail(params);
|
||||
if (res) {
|
||||
descriptions.value = res;
|
||||
}
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less"></style>
|
||||
@@ -0,0 +1,77 @@
|
||||
<template>
|
||||
<div v-if="!showAddView">
|
||||
<BasicTables @register="registerTable" :row-selection="rowSelection">
|
||||
<template #btn>
|
||||
<a-button type="primary" @click="handleAdd">新增</a-button>
|
||||
<a-button type="primary" @click="handleEdit">修改</a-button>
|
||||
<a-button type="primary" @click="handleDelete">删除</a-button>
|
||||
</template>
|
||||
</BasicTables>
|
||||
</div>
|
||||
<div v-if="showAddView">
|
||||
<tab16Add :update="addOrEdit" :userId="props.userInfo.id" :tab16Info="tab16Info" @go-back="goBack"></tab16Add>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { BasicTables } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPages';
|
||||
import { tab16Column } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import tab16Add from '/@/views/archivesManage/employee/fileMaintenance/components/tab16/tab16Add.vue';
|
||||
import { ref } from 'vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { tab16ListApi, tab16DeleteApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
const tab16Info = ref();
|
||||
const { tableContext, onExportXls } = useListPage({
|
||||
tableProps: {
|
||||
api: tab16ListApi,
|
||||
columns: tab16Column,
|
||||
btnArr: ['add', 'edit', 'delete', 'search', 'export', 'print'],
|
||||
showIndexColumn: true,
|
||||
beforeFetch: (params) => {
|
||||
params.userId = props.userInfo.id;
|
||||
return params;
|
||||
},
|
||||
},
|
||||
});
|
||||
const showAddView = ref(false);
|
||||
const addOrEdit = ref(false);
|
||||
const [registerTable, { reload, getForm }, { rowSelection, selectedRowKeys, selectedRows }] = tableContext;
|
||||
function goBack() {
|
||||
showAddView.value = false;
|
||||
selectedRowKeys.value = [];
|
||||
selectedRows.value = [];
|
||||
reload();
|
||||
}
|
||||
function handleAdd() {
|
||||
showAddView.value = true;
|
||||
tab16Info.value = {};
|
||||
}
|
||||
function handleEdit() {
|
||||
console.log(selectedRows.value);
|
||||
if (selectedRowKeys.value.length != 1) {
|
||||
message.warning('请选择一条数据');
|
||||
return;
|
||||
}
|
||||
tab16Info.value = selectedRows.value[0];
|
||||
addOrEdit.value = true;
|
||||
showAddView.value = true;
|
||||
}
|
||||
function handleDelete() {
|
||||
console.log(selectedRows.value);
|
||||
if (selectedRowKeys.value.length == 0) {
|
||||
message.warning('请选择需要删除的记录');
|
||||
return;
|
||||
}
|
||||
const idArr = selectedRows.value.map((item) => {
|
||||
return item.id;
|
||||
});
|
||||
tab16DeleteApi({ ids: idArr }, reload);
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<div class="add-content">
|
||||
<div class="title">
|
||||
<a-button type="primary" @click="goBack" class="addBtn">返回</a-button>
|
||||
<div class="name"> 个人疫苗接种史-{{ update ? '修改' : '新增' }}</div>
|
||||
</div>
|
||||
<div class="form">
|
||||
<a-row>
|
||||
<a-col :span="8">
|
||||
<BasicForm @register="registerForm" />
|
||||
</a-col>
|
||||
<a-col :span="12" class="right-btn">
|
||||
<a-button type="primary" @click="handleSuccess">保存</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { tab16Schemas } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { tab16AddApi, tab16EditApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import { onMounted, ref } from 'vue';
|
||||
const emit = defineEmits(['go-back']);
|
||||
const props = defineProps({
|
||||
update: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
userId: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
tab16Info: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
const [registerForm, { setProps, resetFields, setFieldsValue, validate, updateSchema, clearValidate }] = useForm({
|
||||
labelWidth: 120,
|
||||
schemas: tab16Schemas,
|
||||
showActionButtonGroup: false,
|
||||
});
|
||||
const infoId = ref();
|
||||
onMounted(async () => {
|
||||
if (props.update) {
|
||||
infoId.value = props.tab16Info.id;
|
||||
await setFieldsValue(props.tab16Info);
|
||||
}
|
||||
});
|
||||
function goBack() {
|
||||
emit('go-back');
|
||||
}
|
||||
async function handleSuccess() {
|
||||
try {
|
||||
const value = await validate();
|
||||
value.userId = props.userId;
|
||||
console.log(value);
|
||||
if (props.update) {
|
||||
value.id = infoId.value;
|
||||
await tab16EditApi(value);
|
||||
} else {
|
||||
await tab16AddApi(value);
|
||||
}
|
||||
goBack();
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.add-content {
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
justify-content: space-around;
|
||||
margin-top: 20px;
|
||||
.addBtn {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
}
|
||||
.name {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.form {
|
||||
margin-top: 20px;
|
||||
.right-btn {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: end;
|
||||
align-items: flex-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,714 @@
|
||||
<template>
|
||||
<div style="position: relative">
|
||||
<BasicForm @register="registerForm" class="jeecg-form">
|
||||
<template #first>
|
||||
<div class="sub">基本信息：</div>
|
||||
</template>
|
||||
<template #second>
|
||||
<div class="sub">住院信息：</div>
|
||||
</template>
|
||||
<template #third>
|
||||
<div class="sub">分类信息：</div>
|
||||
</template>
|
||||
<template #A>
|
||||
<a-form :model="data1" class="option-form" ref="optionForm">
|
||||
<a-form-item-rest>
|
||||
<div class="table-d">
|
||||
<div class="table-td-d d1">大病名称</div>
|
||||
<div class="table-td-d d1">确诊年份</div>
|
||||
<div class="table-td-d d1">确诊医院</div>
|
||||
<div class="table-td-d d1">大病状态</div>
|
||||
<div class="table-td-d d1">治疗情况</div>
|
||||
<div class="table-td-d d1">
|
||||
<span v-if="props.editType !== '1'" style="color: #1890ff; cursor: pointer" @click="addItem('a')"> 添加 </span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div>
|
||||
<template v-for="(item, index) in data1.option" :key="`temp${index}`">
|
||||
<div class="table-d table-d-d">
|
||||
<div class="table-td-d tabled-td-d-d d1">
|
||||
<a-form-item
|
||||
:name="['option', index, 'name']"
|
||||
:rules="{
|
||||
required: true,
|
||||
// message: `请输入第${index}个大病名称`,
|
||||
message: '',
|
||||
}"
|
||||
:disabled="props.editType === '1'"
|
||||
>
|
||||
<JDictSelectTag
|
||||
style="max-width: 100%"
|
||||
v-model:value="item.name"
|
||||
placeholder="请选择大病名称"
|
||||
dictCode="ill_type"
|
||||
:disabled="props.editType === '1'"
|
||||
/>
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d1">
|
||||
<a-form-item :name="['option', index, 'time']">
|
||||
<a-date-picker
|
||||
:disabled="props.editType === '1'"
|
||||
v-model:value="item.time"
|
||||
picker="year"
|
||||
value-format="YYYY"
|
||||
/>
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d1">
|
||||
<a-form-item :name="['option', index, 'hospital']">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.hospital" placeholder="请输入确诊医院" />
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d1 user-group">
|
||||
<a-form-item
|
||||
:name="['option', index, 'status']"
|
||||
:rules="{
|
||||
required: true,
|
||||
// message: `请选择第${index}个大病状态`,
|
||||
message: '',
|
||||
}"
|
||||
>
|
||||
<JDictSelectTag
|
||||
style="max-width: 100%"
|
||||
v-model:value="item.status"
|
||||
placeholder="请选择大病状态"
|
||||
dictCode="archives_ill_status"
|
||||
:disabled="props.editType === '1'"
|
||||
/>
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d1">
|
||||
<a-form-item :name="['option', index, 'cure']">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.cure" placeholder="请输入治疗情况" />
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d1">
|
||||
<span v-if="props.editType !== '1'" style="color: #1890ff; cursor: pointer" @click="delItem('a', index)">
|
||||
删除
|
||||
</span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</a-form-item-rest>
|
||||
</a-form>
|
||||
</template>
|
||||
<template #B>
|
||||
<a-form :model="data2" class="option-form" ref="optionForm">
|
||||
<a-form-item-rest>
|
||||
<div class="table-d">
|
||||
<div class="table-td-d d2">慢病名称</div>
|
||||
<div class="table-td-d d2">确诊年份</div>
|
||||
<div class="table-td-d d2">确诊医院</div>
|
||||
<div class="table-td-d d2">治疗情况</div>
|
||||
<div class="table-td-d d2">
|
||||
<span v-if="props.editType !== '1'" style="color: #1890ff; cursor: pointer" @click="addItem('b')"> 添加 </span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div>
|
||||
<template v-for="(item, index) in data2.option" :key="`temp${index}`">
|
||||
<div class="table-d table-d-d">
|
||||
<div class="table-td-d tabled-td-d-d d2">
|
||||
<a-form-item
|
||||
:name="['option', index, 'name']"
|
||||
:rules="{
|
||||
required: true,
|
||||
// message: `请输入第${index}个大病名称`,
|
||||
message: '',
|
||||
}"
|
||||
>
|
||||
<JDictSelectTag
|
||||
style="max-width: 100%"
|
||||
v-model:value="item.name"
|
||||
placeholder="请选择慢病名称"
|
||||
dictCode="hms_disease_type"
|
||||
:disabled="props.editType === '1'"
|
||||
/>
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d2">
|
||||
<a-form-item :name="['option', index, 'time']">
|
||||
<a-date-picker
|
||||
:disabled="props.editType === '1'"
|
||||
v-model:value="item.time"
|
||||
picker="year"
|
||||
value-format="YYYY"
|
||||
/>
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d2">
|
||||
<a-form-item :name="['option', index, 'hospital']">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.hospital" placeholder="请输入确诊医院" />
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d2">
|
||||
<a-form-item :name="['option', index, 'cure']">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.cure" placeholder="请输入治疗情况" />
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d2">
|
||||
<span v-if="props.editType !== '1'" style="color: #1890ff; cursor: pointer" @click="delItem('b', index)">
|
||||
删除
|
||||
</span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</a-form-item-rest>
|
||||
</a-form>
|
||||
</template>
|
||||
<template #C>
|
||||
<a-form :model="data3" class="option-form" ref="optionForm">
|
||||
<a-form-item-rest>
|
||||
<div class="table-d">
|
||||
<div class="table-td-d d3">指标名称</div>
|
||||
<div class="table-td-d d3">指标值</div>
|
||||
<div class="table-td-d d3">参考范围</div>
|
||||
<div class="table-td-d d3">确诊年份</div>
|
||||
<div class="table-td-d d3">确诊医院</div>
|
||||
<div class="table-td-d d3">
|
||||
<span v-if="props.editType !== '1'" style="color: #1890ff; cursor: pointer" @click="addItem('c')"> 添加 </span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div>
|
||||
<template v-for="(item, index) in data3.option" :key="`temp${index}`">
|
||||
<div class="table-d table-d-d">
|
||||
<div class="table-td-d tabled-td-d-d d3">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.name" readonly />
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d3">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.value" readonly />
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d3">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.scope" readonly />
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d3">
|
||||
<a-form-item :name="['option', index, 'hospital']">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.time" readonly />
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d3">
|
||||
<a-form-item :name="['option', index, 'hospital']">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.hospital" readonly />
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d3">
|
||||
<span v-if="props.editType !== '1'" style="color: #1890ff; cursor: pointer" @click="delItem('c', index)">
|
||||
删除
|
||||
</span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</a-form-item-rest>
|
||||
</a-form>
|
||||
</template>
|
||||
<template #D>
|
||||
<a-form :model="data4" class="option-form" ref="optionForm">
|
||||
<a-form-item-rest>
|
||||
<div class="table-d">
|
||||
<div class="table-td-d d4">疾病名称</div>
|
||||
<div class="table-td-d d4">风险等级</div>
|
||||
<div class="table-td-d d4">评估年份</div>
|
||||
<div class="table-td-d d4">
|
||||
<span v-if="props.editType !== '1'" style="color: #1890ff; cursor: pointer" @click="addItem('d')"> 添加 </span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div>
|
||||
<template v-for="(item, index) in data4.option" :key="`temp${index}`">
|
||||
<div class="table-d table-d-d">
|
||||
<div class="table-td-d tabled-td-d-d d4">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.name" readonly />
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d4">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.levelDesc" readonly />
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d4">
|
||||
<a-input :disabled="props.editType === '1'" v-model:value="item.time" readonly />
|
||||
</div>
|
||||
<div class="table-td-d tabled-td-d-d d4">
|
||||
<span v-if="props.editType !== '1'" style="color: #1890ff; cursor: pointer" @click="delItem('d', index)">
|
||||
删除
|
||||
</span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</a-form-item-rest>
|
||||
</a-form>
|
||||
</template>
|
||||
</BasicForm>
|
||||
<a-button type="primary" @click="handleSubmit" style="position: absolute; right: 10px; bottom: 10px" v-if="props.editType !== '1'"
|
||||
>保存</a-button
|
||||
>
|
||||
<ChooseSome
|
||||
class="choose-some"
|
||||
:width="1000"
|
||||
@register="examinationModal"
|
||||
@select-some="onSelectUserOk"
|
||||
title="体检报告"
|
||||
zIndex="1001"
|
||||
:tableprops="tableProps"
|
||||
selection-type="checkbox"
|
||||
/>
|
||||
<ChooseSome
|
||||
class="choose-some"
|
||||
:width="1000"
|
||||
@register="examinationModal1"
|
||||
@select-some="onSelectUserOk1"
|
||||
title="评估结果"
|
||||
zIndex="1001"
|
||||
:tableprops="tableProps1"
|
||||
selection-type="checkbox"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import BasicForm from '/@/components/Form/src/BasicForm.vue';
|
||||
import { useDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||
import { useForm } from '/@/components/Form';
|
||||
import { mSearchSchema, mColumns, mSearchSchema1, mColumns1 } from '/@/views/archive/fiveClassPeople/index.data';
|
||||
import { onMounted, ref, watch } from 'vue';
|
||||
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||
import {
|
||||
groupUserAApi,
|
||||
groupUserBApi,
|
||||
groupUserCApi,
|
||||
groupUserDApi,
|
||||
groupUserEApi,
|
||||
groupUserCLatestReportApi,
|
||||
groupUserDLatestReportApi,
|
||||
detailAApi,
|
||||
detailBApi,
|
||||
detailCApi,
|
||||
detailDApi,
|
||||
groupUserExtByUserIdApi,
|
||||
editByUserIdApi,
|
||||
} from '/@/views/archive/fiveClassPeople/index.api';
|
||||
import ChooseSome from '/@/views/compoents/chooseSome/index.vue';
|
||||
import { tab2schemas } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
editType: {
|
||||
type: String,
|
||||
default: () => '0',
|
||||
},
|
||||
});
|
||||
const data1 = ref<object>({
|
||||
option: [],
|
||||
});
|
||||
const itemA = ref<object>({
|
||||
name: '',
|
||||
time: '',
|
||||
hospital: '',
|
||||
status: '',
|
||||
});
|
||||
const data2 = ref<object>({
|
||||
option: [],
|
||||
});
|
||||
const itemB = ref<object>({
|
||||
name: '',
|
||||
time: '',
|
||||
hospital: '',
|
||||
});
|
||||
const data3 = ref<object>({
|
||||
option: [],
|
||||
});
|
||||
const data4 = ref<object>({
|
||||
option: [],
|
||||
});
|
||||
|
||||
const [examinationModal, { openDrawer }] = useDrawer();
|
||||
const [examinationModal1, { openDrawer: openDrawer1 }] = useDrawer();
|
||||
|
||||
const tableProps = ref({
|
||||
tableProps: {
|
||||
api: groupUserCLatestReportApi,
|
||||
columns: mColumns,
|
||||
canResize: false,
|
||||
immediate: false,
|
||||
clearSelectOnPageChange: false,
|
||||
rowKey: (record: Recordable) => {
|
||||
return JSON.stringify({
|
||||
peItemName: record?.peItemName,
|
||||
peResult: record?.peResult,
|
||||
printContext: record?.printContext,
|
||||
medicalYear: record?.medicalYear,
|
||||
hospitalName: record?.hospitalName,
|
||||
uniItemId: record?.uniItemId,
|
||||
});
|
||||
},
|
||||
beforeFetch: (params) => {
|
||||
params['userId'] = props.userInfo.id;
|
||||
return params;
|
||||
},
|
||||
afterFetch: (data) => {
|
||||
let result: any[] = [];
|
||||
|
||||
data.length > 0 &&
|
||||
data.map((item) => {
|
||||
if (item?.senResultRes && item?.senResultRes.length > 0) {
|
||||
item?.senResultRes.map((it) => {
|
||||
if (it?.thirdResultRes && it?.thirdResultRes.length > 0) {
|
||||
result = result.concat(it?.thirdResultRes);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
return result;
|
||||
},
|
||||
formConfig: {
|
||||
schemas: mSearchSchema,
|
||||
autoSubmitOnEnter: true,
|
||||
showAdvancedButton: false,
|
||||
fieldMapToNumber: [],
|
||||
fieldMapToTime: [],
|
||||
labelWidth: 140,
|
||||
baseColProps: {
|
||||
xs: 12,
|
||||
sm: 12,
|
||||
md: 12,
|
||||
lg: 12,
|
||||
xl: 12,
|
||||
xxl: 12,
|
||||
},
|
||||
actionColOptions: {
|
||||
style: {
|
||||
paddingLeft: '144px',
|
||||
},
|
||||
span: 24,
|
||||
offset: 0,
|
||||
xs: 12,
|
||||
sm: 12,
|
||||
md: 12,
|
||||
lg: 12,
|
||||
xl: 12,
|
||||
xxl: 12,
|
||||
},
|
||||
},
|
||||
showActionColumn: false,
|
||||
},
|
||||
});
|
||||
const tableProps1 = ref({
|
||||
tableProps: {
|
||||
api: groupUserDLatestReportApi,
|
||||
columns: mColumns1,
|
||||
canResize: false,
|
||||
immediate: false,
|
||||
clearSelectOnPageChange: false,
|
||||
rowKey: (record: Recordable) => {
|
||||
return JSON.stringify({
|
||||
name: record?.name,
|
||||
levelDesc: record?.levelDesc,
|
||||
level: record?.level,
|
||||
year: record?.year + '',
|
||||
});
|
||||
},
|
||||
beforeFetch: (params) => {
|
||||
params['userId'] = props.userInfo.id;
|
||||
return params;
|
||||
},
|
||||
showTableSetting: true,
|
||||
tableSetting: {
|
||||
redo: true,
|
||||
setting: false,
|
||||
},
|
||||
// afterFetch: (data) => {
|
||||
// let result: any[] = [];
|
||||
//
|
||||
// data.length > 0 &&
|
||||
// data.map((item) => {
|
||||
// if (item?.senResultRes && item?.senResultRes.length > 0) {
|
||||
// item?.senResultRes.map((it) => {
|
||||
// if (it?.thirdResultRes && it?.thirdResultRes.length > 0) {
|
||||
// result = result.concat(it?.thirdResultRes);
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
//
|
||||
// return result;
|
||||
// },
|
||||
useSearchForm: false,
|
||||
formConfig: {
|
||||
schemas: mSearchSchema1,
|
||||
autoSubmitOnEnter: true,
|
||||
showAdvancedButton: false,
|
||||
fieldMapToNumber: [],
|
||||
fieldMapToTime: [],
|
||||
labelWidth: 120,
|
||||
baseColProps: {
|
||||
xs: 12,
|
||||
sm: 12,
|
||||
md: 12,
|
||||
lg: 12,
|
||||
xl: 12,
|
||||
xxl: 12,
|
||||
},
|
||||
actionColOptions: {
|
||||
style: {
|
||||
paddingLeft: '122px',
|
||||
},
|
||||
span: 24,
|
||||
offset: 0,
|
||||
xs: 12,
|
||||
sm: 12,
|
||||
md: 12,
|
||||
lg: 12,
|
||||
xl: 12,
|
||||
xxl: 12,
|
||||
},
|
||||
},
|
||||
showActionColumn: false,
|
||||
},
|
||||
});
|
||||
onMounted(async () => {
|
||||
await resetFields();
|
||||
data1.value.option = [];
|
||||
data2.value.option = [];
|
||||
data3.value.option = [];
|
||||
data4.value.option = [];
|
||||
await preData();
|
||||
if (props.editType === '1') {
|
||||
await setProps({ disabled: true });
|
||||
}
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.userInfo,
|
||||
async () => {
|
||||
await preData();
|
||||
}
|
||||
);
|
||||
|
||||
async function preData() {
|
||||
let res = {};
|
||||
switch (props.userInfo.userGroup) {
|
||||
case 'a':
|
||||
const { records: r1 } = await detailAApi({ pageNo: 1, pageSize: 9999, userId: props.userInfo.id });
|
||||
res = await groupUserExtByUserIdApi({ pageNo: 1, pageSize: 9999, userId: props.userInfo.id });
|
||||
data1.value.option = r1;
|
||||
break;
|
||||
case 'b':
|
||||
const { records: r2 } = await detailBApi({ pageNo: 1, pageSize: 9999, userId: props.userInfo.id });
|
||||
res = await groupUserExtByUserIdApi({ pageNo: 1, pageSize: 9999, userId: props.userInfo.id });
|
||||
data2.value.option = r2;
|
||||
break;
|
||||
case 'c':
|
||||
const { records: r3 } = await detailCApi({ pageNo: 1, pageSize: 9999, userId: props.userInfo.id });
|
||||
data3.value.option = r3;
|
||||
break;
|
||||
case 'd':
|
||||
const { records: r4 } = await detailDApi({ pageNo: 1, pageSize: 9999, userId: props.userInfo.id });
|
||||
data4.value.option = r4.map((item: any) => ({
|
||||
name: item?.name,
|
||||
levelDesc: item?.levelDesc,
|
||||
level: item?.level,
|
||||
time: item?.time,
|
||||
}));
|
||||
console.log(data4.value.option);
|
||||
break;
|
||||
case 'e':
|
||||
break;
|
||||
}
|
||||
await setFieldsValue({
|
||||
...props.userInfo,
|
||||
...res,
|
||||
});
|
||||
}
|
||||
|
||||
function addItem(type) {
|
||||
console.log(type);
|
||||
switch (type) {
|
||||
case 'a':
|
||||
data1.value?.option.push(JSON.parse(JSON.stringify(itemA.value)));
|
||||
break;
|
||||
case 'b':
|
||||
data2.value?.option.push(JSON.parse(JSON.stringify(itemB.value)));
|
||||
break;
|
||||
case 'c':
|
||||
const list = data3.value.option.map((item: any) => {
|
||||
console.log(item);
|
||||
return JSON.stringify({
|
||||
peItemName: item?.name,
|
||||
peResult: item?.value,
|
||||
printContext: item?.scope,
|
||||
medicalYear: item?.time,
|
||||
hospitalName: item?.hospital,
|
||||
uniItemId: item?.uniItemId,
|
||||
});
|
||||
});
|
||||
openDrawer(true, {
|
||||
selectedRowKeys: list,
|
||||
});
|
||||
break;
|
||||
case 'd':
|
||||
const list1 = data4.value.option.map((item: any) => {
|
||||
return JSON.stringify({
|
||||
name: item?.name,
|
||||
levelDesc: item?.levelDesc,
|
||||
level: item?.level,
|
||||
year: item?.time + '',
|
||||
});
|
||||
});
|
||||
console.log(list1, 1);
|
||||
openDrawer1(true, {
|
||||
selectedRowKeys: list1,
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
function delItem(type, index) {
|
||||
switch (type) {
|
||||
case 'a':
|
||||
data1.value?.option.splice(index, 1);
|
||||
break;
|
||||
case 'b':
|
||||
data2.value?.option.splice(index, 1);
|
||||
break;
|
||||
case 'c':
|
||||
data3.value?.option.splice(index, 1);
|
||||
break;
|
||||
case 'd':
|
||||
data4.value?.option.splice(index, 1);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
const [registerForm, { setFieldsValue, resetFields, validate, getFieldsValue, setProps }] = useForm({
|
||||
schemas: tab2schemas,
|
||||
showAdvancedButton: false,
|
||||
showActionButtonGroup: false,
|
||||
labelWidth: 130,
|
||||
});
|
||||
|
||||
const optionForm = ref();
|
||||
|
||||
async function handleSubmit() {
|
||||
try {
|
||||
const values = await validate();
|
||||
let values1;
|
||||
// if (values['userGroup'] != 'e') {
|
||||
if (!['c', 'd', 'e'].includes(values['userGroup'])) {
|
||||
values1 = await optionForm.value.validate();
|
||||
}
|
||||
|
||||
let params =
|
||||
values['userGroup'] == 'e'
|
||||
? { userId: values.userId }
|
||||
: {
|
||||
userId: values.userId,
|
||||
userGroup: values.userGroup,
|
||||
list: values['userGroup'] === 'c' ? data3.value.option : values['userGroup'] === 'd' ? data4.value.option : values1?.option,
|
||||
};
|
||||
|
||||
switch (values['userGroup']) {
|
||||
case 'a':
|
||||
await editByUserIdApi(values);
|
||||
await groupUserAApi(params);
|
||||
break;
|
||||
case 'b':
|
||||
await editByUserIdApi(values);
|
||||
await groupUserBApi(params);
|
||||
break;
|
||||
case 'c':
|
||||
await groupUserCApi(params);
|
||||
break;
|
||||
case 'd':
|
||||
await groupUserDApi(params);
|
||||
break;
|
||||
case 'e':
|
||||
await groupUserEApi(params);
|
||||
break;
|
||||
}
|
||||
} finally {
|
||||
}
|
||||
}
|
||||
|
||||
function onSelectUserOk(e) {
|
||||
data3.value.option =
|
||||
e.length > 0
|
||||
? e.map((item) => {
|
||||
return {
|
||||
name: JSON.parse(item)?.peItemName,
|
||||
value: JSON.parse(item)?.peResult,
|
||||
scope: JSON.parse(item)?.printContext,
|
||||
time: JSON.parse(item)?.medicalYear,
|
||||
hospital: JSON.parse(item)?.hospitalName,
|
||||
uniItemId: JSON.parse(item)?.uniItemId,
|
||||
};
|
||||
})
|
||||
: [];
|
||||
}
|
||||
|
||||
function onSelectUserOk1(e) {
|
||||
console.log(e);
|
||||
data4.value.option =
|
||||
e.length > 0
|
||||
? e.map((item) => {
|
||||
return {
|
||||
name: JSON.parse(item)?.name,
|
||||
levelDesc: JSON.parse(item)?.levelDesc,
|
||||
level: JSON.parse(item)?.level,
|
||||
time: JSON.parse(item)?.year,
|
||||
};
|
||||
})
|
||||
: [];
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.table-d {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
border-top: 1px solid #f0f0f0;
|
||||
border-right: 1px solid #f0f0f0;
|
||||
.table-td-d {
|
||||
border-left: 1px solid #f0f0f0;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
background-color: #fafafa;
|
||||
height: 50px;
|
||||
line-height: 50px !important;
|
||||
text-align: center;
|
||||
}
|
||||
.d1 {
|
||||
width: calc(100% / 6);
|
||||
}
|
||||
.d2 {
|
||||
width: 20%;
|
||||
}
|
||||
.d4 {
|
||||
width: 25%;
|
||||
}
|
||||
.d3 {
|
||||
width: calc(100% / 6);
|
||||
}
|
||||
.table-d-d {
|
||||
background-color: #ffffff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.option-form {
|
||||
.ant-form-item {
|
||||
line-height: 50px !important;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.user-group .ant-select-selector) {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.sub {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
padding-left: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,368 @@
|
||||
<template>
|
||||
<div class="tab3-content" v-if="!showKnowView && !showTrendView">
|
||||
<div v-for="(item, index) in tab3Arr" :key="index" class="tab3-item-content">
|
||||
<!-- {{ item }}-->
|
||||
|
||||
<div class="title">
|
||||
<span class="title-first">{{ index + 1 }})</span>
|
||||
<span> {{ item.name }}:</span>
|
||||
</div>
|
||||
<div class="information">
|
||||
<span class="info-first" ref="infoFirst">
|
||||
<span v-if="bodyType && item.label == '28306490414597017'">
|
||||
{{ bodyType && bodyType.data1 ? bodyType.data1 : '' }}
|
||||
</span>
|
||||
<span v-if="bodyType && item.label == 'tw0006'">
|
||||
{{ bodyType && bodyType.data5 ? bodyType.data5 : '' }}
|
||||
</span>
|
||||
<span v-if="physique && item.label == 'sg0001'">
|
||||
{{ physique.height ? physique.height.toFixed(1) : '' }}
|
||||
</span>
|
||||
<span v-if="physique && item.label == '28306490414597021'">
|
||||
{{ physique.weight ? physique.weight.toFixed(1) : '' }}
|
||||
</span>
|
||||
<span v-if="physique && item.label == 'bmi0002'">
|
||||
{{ physique.bmi ? physique.bmi.toFixed(1) : '' }}
|
||||
</span>
|
||||
<span v-if="physique && item.label == '28306490414597019'">
|
||||
{{ physique.waist ? physique.waist.toFixed(1) : '' }}
|
||||
</span>
|
||||
<span v-if="physique && item.label == 'tw0003'">
|
||||
{{ physique.hip ? physique.hip.toFixed(1) : '' }}
|
||||
</span>
|
||||
<span v-if="physique && item.label == 'ytb0004'">
|
||||
{{ physique.waistHipRatio ? physique.waistHipRatio.toFixed(1) : '' }}
|
||||
</span>
|
||||
<span v-if="physique && item.label == '28441759235178556'">
|
||||
{{ physique.sbp ? physique.sbp.toFixed(1) : '' }}/{{ physique.dbp ? physique.dbp.toFixed(1) : '' }}
|
||||
</span>
|
||||
<span v-if="physique && item.label == 'xx0005'">
|
||||
{{ physique.blood_dictText ? physique.blood_dictText : '' }}
|
||||
</span>
|
||||
</span>
|
||||
<span class="info-second">{{ item.unit }}</span>
|
||||
</div>
|
||||
<div class="update-time">
|
||||
<span v-if="bodyTime && item.label == '28306490414597017'">
|
||||
更新时间：{{ bodyTime && bodyTime.time1 ? dayjs(bodyTime.time1).format('YYYY-MM-DD') : '--' }}
|
||||
</span>
|
||||
<span v-if="bodyTime && item.label == 'tw0006'">
|
||||
更新时间： {{ bodyTime && bodyTime.time5 ? dayjs(bodyTime.time5).format('YYYY-MM-DD') : '--' }}
|
||||
</span>
|
||||
<span v-if="physique && (item.label == 'sg0001' || item.label == '28306490414597021' || item.label == 'bmi0002')">
|
||||
更新时间： {{ physique && physique.heightLastUpdateTime ? physique.heightLastUpdateTime : '--' }}
|
||||
</span>
|
||||
<span v-if="physique && (item.label == '28306490414597019' || item.label == 'tw0003' || item.label == 'ytb0004')">
|
||||
更新时间： {{ physique && physique.waistLastUpdateTime ? physique.waistLastUpdateTime : '--' }}
|
||||
</span>
|
||||
<span v-if="physique && item.label == '28441759235178556'">
|
||||
更新时间： {{ physique && physique.bpLastUpdateTime ? physique.bpLastUpdateTime : '--' }}
|
||||
</span>
|
||||
<span v-if="physique && item.label == 'xx0005'">
|
||||
更新时间： {{ physique && physique.bloodLastUpdateTime ? physique.bloodLastUpdateTime : '--' }}
|
||||
</span>
|
||||
<!-- <span>更新时间：2023-01-21{{ bodyTime }}</span> heightLastUpdateTime-->
|
||||
</div>
|
||||
<div class="btn-arr">
|
||||
<a-button
|
||||
type="primary"
|
||||
:disabled="!item.addBtn"
|
||||
v-if="![2, 5].includes(index) && props.editType !== '1'"
|
||||
@click="handleOpenModal(index, item)"
|
||||
>
|
||||
新增记录
|
||||
</a-button>
|
||||
<a-button type="primary" @click="showKnow(item.name, item.label)">知识查询</a-button>
|
||||
<a-button type="primary" v-if="![0, 8].includes(index)" @click="showTrend(item.name, item.label, item.type)">
|
||||
趋势分析
|
||||
<LineChartOutlined />
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Tab3know v-if="showKnowView" :title="knowTitle" :label="knowLabel" @go-back="goBack" />
|
||||
<Tab3trend
|
||||
v-if="showTrendView"
|
||||
:api="trendApi"
|
||||
:pageApi="trendPageApi"
|
||||
:title="knowTitle"
|
||||
:type="trendType"
|
||||
:label="trendValue"
|
||||
@go-back="goBack"
|
||||
:userInfo="userInfo"
|
||||
>
|
||||
<template #chartTop="{ topInfo }">
|
||||
<div v-if="knowTitle !== '血压'" class="chartTop">
|
||||
<div class="chartTop-item">
|
||||
<div class="every">
|
||||
<div class="every-item">
|
||||
<span class="content">{{ topInfo.max ? topInfo.max.toFixed(2) : '--' }}</span>
|
||||
<span class="unit">{{ tab3Arr.find((item) => item.name === knowTitle).unit }}</span>
|
||||
</div>
|
||||
<span class="text">最高{{ knowTitle }}</span>
|
||||
</div>
|
||||
<div class="every">
|
||||
<div class="every-item">
|
||||
<span class="content">{{ topInfo.min ? topInfo.min.toFixed(2) : '--' }}</span>
|
||||
<span class="unit">{{ tab3Arr.find((item) => item.name === knowTitle).unit }}</span>
|
||||
</div>
|
||||
<span class="text">最低{{ knowTitle }}</span>
|
||||
</div>
|
||||
<div class="every">
|
||||
<div class="every-item">
|
||||
<span class="content">{{ topInfo.avg ? topInfo.avg.toFixed(2) : '--' }}</span>
|
||||
<span class="unit">{{ tab3Arr.find((item) => item.name === knowTitle).unit }}</span>
|
||||
</div>
|
||||
<span class="text">平均{{ knowTitle }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="knowTitle == '血压'" class="chartTop-xx">
|
||||
<div class="chartTop-item">
|
||||
<div class="every">
|
||||
<div class="every-item">
|
||||
<span class="content">{{ topInfo.maxSbp }}</span>
|
||||
<span class="unit">mmhg</span>
|
||||
</div>
|
||||
<span class="text">最高收缩压</span>
|
||||
</div>
|
||||
<div class="every">
|
||||
<div class="every-item">
|
||||
<span class="content">{{ topInfo.minSbp }}</span>
|
||||
<span class="unit">mmhg</span>
|
||||
</div>
|
||||
<span class="text">最低收缩压</span>
|
||||
</div>
|
||||
<div class="every">
|
||||
<div class="every-item">
|
||||
<span class="content">{{ topInfo.avgSbp ? topInfo.avgSbp.toFixed(2) : '--' }}</span>
|
||||
<span class="unit">mmhg</span>
|
||||
</div>
|
||||
<span class="text">平均收缩压</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chartTop-item">
|
||||
<div class="every">
|
||||
<div class="every-item">
|
||||
<span class="content">{{ topInfo.maxDbp }}</span>
|
||||
<span class="unit">mmhg</span>
|
||||
</div>
|
||||
<span class="text">最高舒张压</span>
|
||||
</div>
|
||||
<div class="every">
|
||||
<div class="every-item">
|
||||
<span class="content">{{ topInfo.minDbp }}</span>
|
||||
<span class="unit">mmhg</span>
|
||||
</div>
|
||||
<span class="text">最高舒张压</span>
|
||||
</div>
|
||||
<div class="every">
|
||||
<div class="every-item">
|
||||
<span class="content">{{ topInfo.avgDbp ? topInfo.avgDbp.toFixed(2) : '--' }}</span>
|
||||
<span class="unit">mmhg</span>
|
||||
</div>
|
||||
<span class="text">平均舒张压</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</Tab3trend>
|
||||
|
||||
<tab3-modal @register="registerModal" @success="handleSuccess" />
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { tab3Arr } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { LineChartOutlined } from '@ant-design/icons-vue';
|
||||
import Tab3know from '/@/views/archivesManage/employee/fileMaintenance/components/tab3/tab3know.vue';
|
||||
import Tab3trend from '/@/views/archivesManage/employee/fileMaintenance/components/tab3/tab3trend.vue';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import Tab3Modal from '/@/views/archivesManage/employee/fileMaintenance/components/tab3/tab3Modal.vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { Dict } from '/@/utils/cache/dict';
|
||||
import {
|
||||
tab3BodyTypeAnalysisLineApi,
|
||||
tab3BodyTypeAnalysisListApi,
|
||||
tab3BodyTypeApi,
|
||||
tab3PhysiqueApi,
|
||||
tab3PhysiqueCommonTrendApi,
|
||||
tab3PhysiqueCommonPageApi,
|
||||
tab3PhysiqueBloodTrendApi,
|
||||
tab3PhysiqueBloodPageApi,
|
||||
} from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
const [registerModal, { openModal }] = useModal();
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
editType: {
|
||||
type: String,
|
||||
default: () => '0',
|
||||
},
|
||||
});
|
||||
const showKnowView = ref(false);
|
||||
const showTrendView = ref(false);
|
||||
const knowTitle = ref('');
|
||||
const knowLabel = ref('');
|
||||
const trendValue = ref();
|
||||
const bodyType = ref();
|
||||
const bodyTime = ref();
|
||||
const physique = ref();
|
||||
const infoArr = ref();
|
||||
onMounted(async () => {
|
||||
const res = Dict.getDict('archives_body_type');
|
||||
infoArr.value = res;
|
||||
getInfo();
|
||||
});
|
||||
const infoFirst = ref();
|
||||
async function getInfo() {
|
||||
const bodyRes = await tab3BodyTypeApi({ userId: props.userInfo?.id });
|
||||
// bodyType.value = bodyRes;
|
||||
bodyType.value = bodyRes.reduce((acc, item) => {
|
||||
// 根据 type 值动态生成数据键
|
||||
acc[`data${item.type}`] = item.dataValue;
|
||||
return acc;
|
||||
}, {});
|
||||
bodyTime.value = bodyRes.reduce((acc, item) => {
|
||||
// 根据 type 值动态生成数据键
|
||||
acc[`time${item.type}`] = item.createDate;
|
||||
return acc;
|
||||
}, {});
|
||||
const phyRes = await tab3PhysiqueApi({ userId: props.userInfo?.id });
|
||||
physique.value = phyRes;
|
||||
}
|
||||
function showKnow(title, label) {
|
||||
knowTitle.value = title;
|
||||
knowLabel.value = label;
|
||||
showKnowView.value = true;
|
||||
}
|
||||
const trendApi = ref();
|
||||
const trendPageApi = ref();
|
||||
const trendType = ref();
|
||||
function showTrend(title, label, type) {
|
||||
knowTitle.value = title;
|
||||
trendValue.value = label;
|
||||
showTrendView.value = true;
|
||||
trendType.value = type;
|
||||
if (label == 'tw0006' || label == '28306490414597017') {
|
||||
trendApi.value = tab3BodyTypeAnalysisLineApi;
|
||||
trendPageApi.value = tab3BodyTypeAnalysisListApi;
|
||||
} else if (label == '28441759235178556') {
|
||||
trendApi.value = tab3PhysiqueBloodTrendApi;
|
||||
trendPageApi.value = tab3PhysiqueBloodPageApi;
|
||||
} else {
|
||||
trendApi.value = tab3PhysiqueCommonTrendApi;
|
||||
trendPageApi.value = tab3PhysiqueCommonPageApi;
|
||||
}
|
||||
}
|
||||
function handleOpenModal(index, item) {
|
||||
const innerSpan = infoFirst.value ? infoFirst.value[index].querySelector('span') : null;
|
||||
openModal(true, {
|
||||
field: tab3Arr[index].label,
|
||||
label: item.label,
|
||||
userId: props.userInfo?.id,
|
||||
value: innerSpan ? innerSpan.textContent : '',
|
||||
});
|
||||
}
|
||||
function goBack() {
|
||||
showKnowView.value = false;
|
||||
showTrendView.value = false;
|
||||
}
|
||||
function handleSuccess() {
|
||||
getInfo();
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.tab3-content {
|
||||
.tab3-item-content {
|
||||
display: flex;
|
||||
height: 50px;
|
||||
align-items: center;
|
||||
.title {
|
||||
width: 100px;
|
||||
font-weight: bold;
|
||||
.title-first {
|
||||
display: inline-block;
|
||||
width: 30px;
|
||||
}
|
||||
}
|
||||
.information {
|
||||
width: 200px;
|
||||
background: #f5f5f5;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 10px;
|
||||
border-radius: 4px;
|
||||
height: 30px;
|
||||
.info-first {
|
||||
flex: 1;
|
||||
}
|
||||
.info-second {
|
||||
width: 60px;
|
||||
text-align: center;
|
||||
border-left: 1px solid #ccc;
|
||||
}
|
||||
}
|
||||
.update-time {
|
||||
margin: 0 25px 0 20px;
|
||||
}
|
||||
.btn-arr {
|
||||
:deep(.is-disabled) {
|
||||
background: #9c9c9c !important;
|
||||
color: #fff !important;
|
||||
border-color: #9c9c9c !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.chartTop {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.chartTop-item {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
width: 40%;
|
||||
.every {
|
||||
text-align: center;
|
||||
.every-item {
|
||||
text-align: center;
|
||||
|
||||
font-weight: bold;
|
||||
.content {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.text {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
.chartTop-xx {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.chartTop-item {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
width: 40%;
|
||||
border: 1px solid #999;
|
||||
margin: 0 10px;
|
||||
.every {
|
||||
text-align: center;
|
||||
.every-item {
|
||||
text-align: center;
|
||||
|
||||
font-weight: bold;
|
||||
.content {
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.text {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,159 @@
|
||||
<template>
|
||||
<BasicModal @register="registerModal" title="新增记录" @ok="handleOk">
|
||||
<BasicForm @register="registerForm">
|
||||
<template #xx="{ modal }">
|
||||
<div class="mmhg">
|
||||
<div class="dsbp">舒张压:</div>
|
||||
<a-input v-model:value="dbpValue" suffix="mmHg" />
|
||||
<div class="dsbp">收缩压:</div>
|
||||
<a-input v-model:value="sbpValue" suffix="mmHg" />
|
||||
</div>
|
||||
<!-- 28441759235178556-->
|
||||
</template>
|
||||
</BasicForm>
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import BasicModal from '/@/components/Modal/src/BasicModal.vue';
|
||||
import { useModalInner } from '/@/components/Modal';
|
||||
import BasicForm from '/@/components/Form/src/BasicForm.vue';
|
||||
import { FormSchema, useForm } from '/@/components/Form';
|
||||
import { bloodType, tab3ForSchema } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { tab3BodyTypeAddApi, tab3PhysiqueAddApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import { ref } from 'vue';
|
||||
|
||||
const emit = defineEmits(['success']);
|
||||
const [registerForm, { setProps, validate, setFieldsValue }] = useForm({
|
||||
showActionButtonGroup: false,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 4 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 18 },
|
||||
},
|
||||
});
|
||||
const label = ref();
|
||||
const userId = ref();
|
||||
const dbpValue = ref();
|
||||
const sbpValue = ref();
|
||||
const [registerModal, { closeModal }] = useModalInner(async (data) => {
|
||||
await setProps({
|
||||
schemas: [
|
||||
tab3ForSchema.find((item) => {
|
||||
return item.field === data.field;
|
||||
}),
|
||||
] as FormSchema[],
|
||||
});
|
||||
await setFieldsValue({
|
||||
[data.field]: data.value,
|
||||
});
|
||||
if (data.label == '28441759235178556') {
|
||||
sbpValue.value = data.value.split('/')[0];
|
||||
dbpValue.value = data.value.split('/')[1];
|
||||
}
|
||||
if (data.label == 'xx0005') {
|
||||
console.log(getValueByLabel(data.value));
|
||||
await setFieldsValue({
|
||||
[data.field]: getValueByLabel(data.value),
|
||||
});
|
||||
}
|
||||
label.value = data.label;
|
||||
userId.value = data.userId;
|
||||
});
|
||||
async function handleOk() {
|
||||
try {
|
||||
const value = await validate();
|
||||
switch (label.value) {
|
||||
case 'tw0006':
|
||||
const params1 = {
|
||||
userId: userId.value,
|
||||
dataValue: value[label.value],
|
||||
type: 5,
|
||||
};
|
||||
await tab3BodyTypeAddApi(params1);
|
||||
break;
|
||||
case '28306490414597017':
|
||||
const params2 = {
|
||||
userId: userId.value,
|
||||
dataValue: value[label.value],
|
||||
type: 1,
|
||||
};
|
||||
await tab3BodyTypeAddApi(params2);
|
||||
break;
|
||||
case 'sg0001':
|
||||
const params3 = {
|
||||
userId: userId.value,
|
||||
value: value[label.value],
|
||||
type: 1,
|
||||
};
|
||||
await tab3PhysiqueAddApi(params3);
|
||||
break;
|
||||
case '28306490414597021':
|
||||
const params4 = {
|
||||
userId: userId.value,
|
||||
value: value[label.value],
|
||||
type: 2,
|
||||
};
|
||||
await tab3PhysiqueAddApi(params4);
|
||||
break;
|
||||
case '28306490414597019':
|
||||
const params5 = {
|
||||
userId: userId.value,
|
||||
value: value[label.value],
|
||||
type: 4,
|
||||
};
|
||||
await tab3PhysiqueAddApi(params5);
|
||||
break;
|
||||
case 'tw0003':
|
||||
const params6 = {
|
||||
userId: userId.value,
|
||||
value: value[label.value],
|
||||
type: 5,
|
||||
};
|
||||
await tab3PhysiqueAddApi(params6);
|
||||
break;
|
||||
case '28441759235178556':
|
||||
console.log(dbpValue.value, sbpValue.value);
|
||||
const params7 = {
|
||||
userId: userId.value,
|
||||
value: dbpValue.value ? dbpValue.value : '',
|
||||
value2: sbpValue.value ? sbpValue.value : '',
|
||||
type: 7,
|
||||
};
|
||||
await tab3PhysiqueAddApi(params7);
|
||||
break;
|
||||
case 'xx0005':
|
||||
const params8 = {
|
||||
userId: userId.value,
|
||||
value: value[label.value],
|
||||
type: 9,
|
||||
};
|
||||
await tab3PhysiqueAddApi(params8);
|
||||
break;
|
||||
}
|
||||
closeModal();
|
||||
emit('success');
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
function getValueByLabel(label) {
|
||||
return bloodType.find((item) => {
|
||||
return item.label == label;
|
||||
})?.value;
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.mmhg {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
.dsbp {
|
||||
width: 150px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,51 @@
|
||||
<template>
|
||||
<a-button @click="goBack" type="primary" style="width: 80px">返回</a-button>
|
||||
<div class="know-content">
|
||||
<div class="title"> 知识科普-{{ title }}</div>
|
||||
<div class="detail" v-if="infoValue"> {{ infoValue?.subSynopsis }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { tab3ModelApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import { onMounted, ref } from 'vue';
|
||||
const emit = defineEmits(['go-back']);
|
||||
const props = defineProps({
|
||||
title: {
|
||||
type: String,
|
||||
},
|
||||
label: {
|
||||
type: String,
|
||||
},
|
||||
});
|
||||
const infoValue = ref();
|
||||
onMounted(async () => {
|
||||
const res = await tab3ModelApi({
|
||||
modeId: props.label,
|
||||
});
|
||||
infoValue.value = res;
|
||||
});
|
||||
function goBack() {
|
||||
emit('go-back');
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.know-content {
|
||||
text-align: center;
|
||||
height: calc(100% - 40px);
|
||||
.title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.detail {
|
||||
width: 100%;
|
||||
height: calc(100% - 66px);
|
||||
background-color: #fbfdff;
|
||||
border: 1px solid #999;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
padding: 10px;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,297 @@
|
||||
<template>
|
||||
<div class="trend-detail">
|
||||
<div class="title">
|
||||
<a-button type="primary" @click="goBack" style="position: absolute; left: 0">返回</a-button>
|
||||
<div class="name"> {{ title }}-趋势分析</div>
|
||||
</div>
|
||||
|
||||
<div style="display: flex; width: 100%; justify-content: center; padding-top: 10px">
|
||||
<a-radio-group v-model:value="active" button-style="solid" @change="changeRadio">
|
||||
<a-radio-button :value="1">日</a-radio-button>
|
||||
<a-radio-button :value="2">周</a-radio-button>
|
||||
<a-radio-button :value="3">月</a-radio-button>
|
||||
<a-radio-button :value="4">年</a-radio-button>
|
||||
</a-radio-group>
|
||||
</div>
|
||||
<div style="width: 100%; display: flex; font-size: 20px; align-items: center; justify-content: center; padding: 10px">
|
||||
<a-button size="small" @click="changeDate('0')">
|
||||
<LeftOutlined />
|
||||
</a-button>
|
||||
<div style="position: relative">
|
||||
<a-date-picker
|
||||
ref="datePicker"
|
||||
v-model:value="dateInfo"
|
||||
:disabledDate="(current) => current > new Date()"
|
||||
:format="rType()"
|
||||
:picker="getP()"
|
||||
@change="changeValue"
|
||||
:allow-clear="false"
|
||||
style="opacity: 0; z-index: 99; position: absolute; top: 0; left: 0"
|
||||
>
|
||||
<template #dateRender="{ current }">
|
||||
<div class="ant-picker-cell-inner">
|
||||
{{ current.date() }}
|
||||
</div>
|
||||
</template>
|
||||
</a-date-picker>
|
||||
<div style="z-index: 1; min-width: 150px; padding: 0 10px; text-align: center">{{ getDateFormat(dateInfo) }}</div>
|
||||
</div>
|
||||
<a-button :disabled="!isRight" size="small" @click="changeDate('1')">
|
||||
<RightOutlined />
|
||||
</a-button>
|
||||
</div>
|
||||
|
||||
<slot name="chartTop" v-bind="{ topInfo }"> </slot>
|
||||
|
||||
<div ref="chartRef" class="container" id="container"> </div>
|
||||
|
||||
<BasicTable @register="registerTable" table-type="1" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, Ref, onMounted, nextTick } from 'vue';
|
||||
import { LeftOutlined, RightOutlined } from '@ant-design/icons-vue';
|
||||
import dayjs from 'dayjs';
|
||||
import BasicTable from '/@/components/Table/src/BasicTable.vue';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { useECharts } from '/@/hooks/web/useECharts';
|
||||
import { getOptions } from '/@/views/archivesManage/employee/fileMaintenance/components/tab3/trend.data';
|
||||
import { tab3TrendColumn1, tab3TrendColumn2 } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
|
||||
const emit = defineEmits(['go-back']);
|
||||
const dateInfo = ref(dayjs());
|
||||
const active = ref(1);
|
||||
const topInfo = ref({});
|
||||
const props = defineProps({
|
||||
title: {
|
||||
type: String,
|
||||
},
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
label: {
|
||||
type: String,
|
||||
},
|
||||
api: {
|
||||
type: Function,
|
||||
default: () => ({}),
|
||||
},
|
||||
pageApi: {
|
||||
type: Function,
|
||||
default: () => ({}),
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
},
|
||||
});
|
||||
const customWeekStartEndFormat = (value) =>
|
||||
`${dayjs(value).startOf('week').format(weekFormat)} ~ ${dayjs(value).endOf('week').format(weekFormat)}`;
|
||||
const isRight = computed(() => {
|
||||
return dayjs(dateInfo.value).valueOf() - dayjs(new Date()).valueOf() < -86400000;
|
||||
});
|
||||
|
||||
const dateFormat = 'YYYY-MM-DD';
|
||||
const weekFormat = 'YYYY-MM-DD';
|
||||
const monthFormat = 'YYYY-MM';
|
||||
|
||||
const { tableContext } = useListPage({
|
||||
tableProps: {
|
||||
immediate: false,
|
||||
pagination: false,
|
||||
showIndexColumn: true,
|
||||
useSearchForm: false,
|
||||
showTableSetting: false,
|
||||
clickToRowSelect: false,
|
||||
showActionColumn: false,
|
||||
},
|
||||
});
|
||||
|
||||
const [registerTable, { reload, setProps }] = tableContext;
|
||||
const startData = ref(dayjs(dateInfo.value).format('YYYY-MM-DD'));
|
||||
const endData = ref(dayjs(dateInfo.value).format('YYYY-MM-DD'));
|
||||
function changeValue() {
|
||||
if (active.value == 1) {
|
||||
startData.value = dayjs(dateInfo.value).format('YYYY-MM-DD');
|
||||
endData.value = dayjs(dateInfo.value).format('YYYY-MM-DD');
|
||||
}
|
||||
if (active.value == 2) {
|
||||
startData.value = dayjs(dateInfo.value).startOf('week').format('YYYY-MM-DD');
|
||||
endData.value = dayjs(dateInfo.value).endOf('week').format('YYYY-MM-DD');
|
||||
}
|
||||
if (active.value == 3) {
|
||||
startData.value = dayjs(dateInfo.value).startOf('month').format('YYYY-MM-DD');
|
||||
endData.value = dayjs(dateInfo.value).endOf('month').format('YYYY-MM-DD');
|
||||
}
|
||||
if (active.value == 4) {
|
||||
startData.value = dayjs(dateInfo.value).startOf('year').format('YYYY-MM-DD');
|
||||
endData.value = dayjs(dateInfo.value).endOf('year').format('YYYY-MM-DD');
|
||||
}
|
||||
getTrandAndPage();
|
||||
}
|
||||
const yearValue = ref([]);
|
||||
const dataValue = ref([]);
|
||||
onMounted(async () => {
|
||||
getTrandAndPage();
|
||||
});
|
||||
|
||||
const chartRef = ref<HTMLDivElement | null>(null);
|
||||
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
|
||||
onMounted(() => {});
|
||||
function setData() {
|
||||
setOptions(getOptions(yearValue.value, [dataValue.value]) as any);
|
||||
}
|
||||
async function getTrandAndPage() {
|
||||
setProps({
|
||||
api: props.pageApi,
|
||||
columns: props.label == 'tw0006' || props.label == '28306490414597017' ? tab3TrendColumn1 : tab3TrendColumn2,
|
||||
beforeFetch: (params) => {
|
||||
params.userId = props.userInfo.id;
|
||||
params.type = props.type;
|
||||
return params;
|
||||
},
|
||||
});
|
||||
reload();
|
||||
let data = await props.api({
|
||||
userId: props.userInfo.id,
|
||||
type: props.type,
|
||||
startDate: startData.value,
|
||||
endDate: endData.value,
|
||||
startTime: startData.value,
|
||||
endTime: endData.value,
|
||||
scope: active.value,
|
||||
timeType: active.value,
|
||||
});
|
||||
if (props.label == 'tw0006' || props.label == '28306490414597017') {
|
||||
yearValue.value = data.data ? data.data.map((item) => item.createDate) : [];
|
||||
if (active.value !== 1) {
|
||||
yearValue.value = yearValue.value.map((item) => {
|
||||
return dayjs(item).format('YYYY-MM-DD');
|
||||
});
|
||||
}
|
||||
dataValue.value = data.data ? data.data.map((item) => item.dataValue) : [];
|
||||
topInfo.value = {
|
||||
max: data.dataMax ? data.dataMax : '',
|
||||
min: data.dataMin ? data.dataMin : '',
|
||||
avg: data.dataAvg ? data.dataAvg : '',
|
||||
};
|
||||
nextTick(() => {
|
||||
setData();
|
||||
});
|
||||
} else if (props.label == '28441759235178556') {
|
||||
yearValue.value = data && data.dataList ? data.dataList.map((item) => item.time) : [];
|
||||
|
||||
const a =
|
||||
data && data.dataList
|
||||
? data.dataList.map((item) => {
|
||||
return item.sbp;
|
||||
})
|
||||
: [];
|
||||
const b =
|
||||
data && data.dataList
|
||||
? data.dataList.map((item) => {
|
||||
return item.dbp;
|
||||
})
|
||||
: [];
|
||||
topInfo.value = {
|
||||
maxSbp: data && data.maxSbp ? data.maxSbp : '',
|
||||
minSbp: data && data.minSbp ? data.minSbp : '',
|
||||
avgSbp: data && data.avgSbp ? data.avgSbp : '',
|
||||
maxDbp: data && data.maxDbp ? data.maxDbp : '',
|
||||
minDbp: data && data.minDbp ? data.minDbp : '',
|
||||
avgDbp: data && data.avgDbp ? data.avgDbp : '',
|
||||
};
|
||||
|
||||
dataValue.value = [a, b];
|
||||
setOptions(getOptions(yearValue.value, [...dataValue.value]) as any);
|
||||
console.log(dataValue.value);
|
||||
} else {
|
||||
yearValue.value = data && data.dataList ? data.dataList.map((item) => item.time) : [];
|
||||
dataValue.value = data && data.dataList ? data.dataList.map((item) => item.dataValue) : [];
|
||||
topInfo.value = {
|
||||
max: data && data.maxData ? data.maxData : '',
|
||||
min: data && data.minData ? data.minData : '',
|
||||
avg: data && data.avgData ? data.avgData : '',
|
||||
};
|
||||
nextTick(() => {
|
||||
setData();
|
||||
});
|
||||
}
|
||||
}
|
||||
function rType() {
|
||||
switch (active.value) {
|
||||
case 1:
|
||||
return dateFormat;
|
||||
case 2:
|
||||
return customWeekStartEndFormat(dateInfo.value);
|
||||
case 3:
|
||||
return monthFormat;
|
||||
case 4:
|
||||
return 'YYYY';
|
||||
}
|
||||
return '';
|
||||
}
|
||||
function getP() {
|
||||
switch (active.value) {
|
||||
case 2:
|
||||
return 'week';
|
||||
case 3:
|
||||
return 'month';
|
||||
case 4:
|
||||
return 'year';
|
||||
}
|
||||
return '';
|
||||
}
|
||||
function getDateFormat(v) {
|
||||
return active.value === 2 ? customWeekStartEndFormat(v) : dayjs(v).format(rType());
|
||||
}
|
||||
|
||||
function weekNext(x, data) {
|
||||
let d = dayjs(getDateFormat(data).substring(getDateFormat(data).indexOf('~') + 2));
|
||||
|
||||
return x.diff(d, 'day') < 0;
|
||||
}
|
||||
|
||||
function changeRadio() {
|
||||
dateInfo.value = dayjs(new Date());
|
||||
changeValue();
|
||||
}
|
||||
function changeDate(type) {
|
||||
switch (active.value) {
|
||||
case 1:
|
||||
dateInfo.value = type === '0' ? dayjs(dateInfo.value).subtract(1, 'day') : dayjs(dateInfo.value).add(1, 'day');
|
||||
break;
|
||||
case 2:
|
||||
dateInfo.value = type === '0' ? dayjs(dateInfo.value).subtract(1, 'week') : dayjs(dateInfo.value).add(1, 'week');
|
||||
break;
|
||||
case 3:
|
||||
dateInfo.value = type === '0' ? dayjs(dateInfo.value).subtract(1, 'month') : dayjs(dateInfo.value).add(1, 'month');
|
||||
break;
|
||||
case 4:
|
||||
dateInfo.value = type === '0' ? dayjs(dateInfo.value).subtract(1, 'year') : dayjs(dateInfo.value).add(1, 'year');
|
||||
break;
|
||||
}
|
||||
changeValue();
|
||||
}
|
||||
function goBack() {
|
||||
emit('go-back');
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.trend-detail {
|
||||
.title {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.name {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
min-height: 300px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,27 @@
|
||||
export const getOptions = (xData: any[] = [], yData: any[] = []) => ({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: xData,
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: top,
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
},
|
||||
series: getSeries(yData),
|
||||
});
|
||||
|
||||
function getSeries(data) {
|
||||
return data.map((item) => {
|
||||
return {
|
||||
type: 'line',
|
||||
data: item,
|
||||
smooth: true,
|
||||
};
|
||||
});
|
||||
}
|
||||
@@ -0,0 +1,130 @@
|
||||
<template>
|
||||
<div class="outer-4">
|
||||
<div v-show="pageValue === '0'" style="height: 100%; display: flex; flex-direction: column">
|
||||
<a-radio-group button-style="solid" class="radio-group-d" v-model:value="radioValue" @change="changeRadioValue">
|
||||
<a-radio-button v-for="(item, index) in unitList.slice(0, unitList.length - 2)" :key="`unit-${index}`" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-radio-button>
|
||||
</a-radio-group>
|
||||
|
||||
<div v-if="radioInfoList.length > 0" class="radio-value-list">
|
||||
<div
|
||||
v-for="(item, index) in radioInfoList"
|
||||
:class="[classItemId === item.id ? 'selected-class' : '']"
|
||||
:key="`radio-value-list-${index}`"
|
||||
@click="clickClassItem(item)"
|
||||
>
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="flex: 1" v-if="radioValue === '1'"> <examination-report :user-id="userInfo.id" /></div>
|
||||
<div style="flex: 1; overflow: auto" v-if="radioValue !== '1'">
|
||||
<tab4-list :user-id="userInfo.id" :medical-uni-item-class-id="classItemId" @history-info="getHistoryInfo" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="pageValue !== '0'" style="height: 100%; display: flex; flex-direction: column">
|
||||
<histor-info
|
||||
:list-info="listInfo"
|
||||
@go-back="
|
||||
() => {
|
||||
pageValue = '0';
|
||||
}
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { selectMedicalUniItemClassListApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import ExaminationReport from '/@/views/archivesManage/employee/fileMaintenance/components/tab4/examinationReport.vue';
|
||||
import Tab4List from '/@/views/archivesManage/employee/fileMaintenance/components/tab4/tab4List.vue';
|
||||
import HistorInfo from '/@/views/archivesManage/employee/fileMaintenance/components/tab4/historInfo.vue';
|
||||
|
||||
const pageValue = ref('0');
|
||||
|
||||
const listInfo = ref();
|
||||
const radioInfoList = ref<any[]>([]);
|
||||
const radioValue = ref('1');
|
||||
const unitList = ref<any[]>([]);
|
||||
const classItemId = ref('');
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
|
||||
onMounted(async () => {
|
||||
await getUnitList();
|
||||
});
|
||||
|
||||
function getHistoryInfo(v) {
|
||||
console.log(v);
|
||||
listInfo.value = v;
|
||||
pageValue.value = '1';
|
||||
}
|
||||
|
||||
function changeRadioValue(e) {
|
||||
radioInfoList.value =
|
||||
unitList.value.find((item) => {
|
||||
return item.id === e.target.value;
|
||||
})?.childList || [];
|
||||
|
||||
classItemId.value = radioInfoList.value.length > 0 ? radioInfoList.value[0].id : '';
|
||||
}
|
||||
|
||||
async function getUnitList() {
|
||||
try {
|
||||
unitList.value = await selectMedicalUniItemClassListApi({ sex: props.userInfo?.sex });
|
||||
|
||||
unitList.value.unshift({
|
||||
id: '1',
|
||||
name: '体检报告',
|
||||
childList: [],
|
||||
});
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
|
||||
function clickClassItem(item) {
|
||||
classItemId.value = item.id;
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.outer-4 {
|
||||
height: calc(100% - 46px);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
:deep(.ant-radio-button-wrapper) {
|
||||
color: #1684fc !important;
|
||||
border-color: #1684fc !important;
|
||||
&:before {
|
||||
background-color: #1684fc !important;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-radio-button-wrapper-checked) {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.radio-value-list {
|
||||
margin-top: 5px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
> div {
|
||||
cursor: pointer;
|
||||
margin: 0 5px 5px 0;
|
||||
background-color: #b4c7e7;
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.selected-class {
|
||||
background-color: #567aa1 !important;
|
||||
color: #ffffff;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
+84
@@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<BasicTable @register="registerTable">
|
||||
<!--操作栏-->
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex === 'look'">
|
||||
<a-button type="link" @click="handleDetail(record)">查看</a-button>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'downLoad'">
|
||||
<a-button type="link" @click="handleDownLoad(record)">下载</a-button>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
<UserReport ref="reportRefs" @register="lookRecordModal" />
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { BasicTable, TableAction } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { list, report } from '/@/views/archive/employeeFile/components/examinationReport/examinationReport.api';
|
||||
import UserReport from '/@/views/medical/report/userResult/components/UserReport.vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { tab4ReportColumns } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { downReport } from '/@/views/medical/report/userResult/UserResult.api';
|
||||
const reportRefs = ref('');
|
||||
const route = useRoute();
|
||||
const props = defineProps({
|
||||
userId: {
|
||||
type: String,
|
||||
default: () => '',
|
||||
},
|
||||
});
|
||||
// 注册modal
|
||||
const [lookRecordModal, { openModal }] = useModal();
|
||||
// 注册table数据
|
||||
const { tableContext } = useListPage({
|
||||
tableProps: {
|
||||
title: '体检报告',
|
||||
columns: tab4ReportColumns,
|
||||
api: list,
|
||||
canResize: false,
|
||||
searchInfo: {
|
||||
userId: props.userId,
|
||||
},
|
||||
tableSetting: {
|
||||
redo: true,
|
||||
setting: false,
|
||||
},
|
||||
showActionColumn: false,
|
||||
useSearchForm: false,
|
||||
actionColumn: {
|
||||
width: 120,
|
||||
fixed: 'right',
|
||||
},
|
||||
},
|
||||
});
|
||||
const [registerTable] = tableContext;
|
||||
async function handleDetail(record: Recordable) {
|
||||
let { medicalYear } = record;
|
||||
try {
|
||||
// let res = await report({ id: medicalId });
|
||||
let res = await report({ userId: props.userId, medicalYear: medicalYear });
|
||||
// let classVoList = replaceProperties(res?.resultItemResList || []);
|
||||
// const result = {
|
||||
// conclusion: res?.conclusion,
|
||||
// recommendation: res?.suggest,
|
||||
// classVoList: classVoList,
|
||||
// };
|
||||
reportRefs.value['handlePhysical'](res);
|
||||
} catch {
|
||||
reportRefs.value['handlePhysical']({});
|
||||
}
|
||||
openModal(true, {
|
||||
isUpdate: true,
|
||||
showFooter: false,
|
||||
});
|
||||
}
|
||||
|
||||
function handleDownLoad(record: Recordable) {
|
||||
downReport({ id: record.medicalId });
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less"></style>
|
||||
@@ -0,0 +1,144 @@
|
||||
<template>
|
||||
<div class="d">
|
||||
<div style="display: flex; align-items: center; justify-content: space-between">
|
||||
<a-button
|
||||
type="primary"
|
||||
@click="
|
||||
() => {
|
||||
emit('goBack');
|
||||
}
|
||||
"
|
||||
>返回</a-button
|
||||
>
|
||||
<div style="font-size: 18px; font-weight: bold"> {{ props.listInfo?.peItemName }}-历史趋势 </div>
|
||||
<div>
|
||||
<a-range-picker v-model:value="yearInfo" picker="year" @change="changeDate" format="YYYY" value-format="YYYY" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="padding: 10px 0">
|
||||
<div ref="chartRef" class="container" id="container"> </div>
|
||||
</div>
|
||||
|
||||
<div style="flex: 1; overflow: auto">
|
||||
<div class="table-d">
|
||||
<div style="width: 60px">序号</div>
|
||||
<div style="flex: 1">体检年份</div>
|
||||
<div style="flex: 1">数值</div>
|
||||
<div style="flex: 1">参考值</div>
|
||||
</div>
|
||||
<div class="table-d-1">
|
||||
<template v-if="props?.listInfo?.list && props?.listInfo?.list.length > 0">
|
||||
<template v-for="(item, index) in props?.listInfo?.list.reverse()" :key="`dataList-${index}`">
|
||||
<div style="display: flex">
|
||||
<div style="width: 60px">{{ index + 1 }}</div>
|
||||
<div style="flex: 1">{{ item.peYear }}</div>
|
||||
<div style="flex: 1">{{ item.peResult }}</div>
|
||||
<div style="flex: 1">{{ item.printContext + item.unit }}</div>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { nextTick, onMounted, Ref, ref } from 'vue';
|
||||
import dayjs from 'dayjs';
|
||||
import { useECharts } from '/@/hooks/web/useECharts';
|
||||
import { getOptions } from '/@/views/archivesManage/employee/fileMaintenance/components/tab3/trend.data';
|
||||
|
||||
const props = defineProps({
|
||||
listInfo: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
});
|
||||
const emit = defineEmits(['goBack']);
|
||||
|
||||
const yearInfo = ref<any[]>([]);
|
||||
|
||||
const chartRef = ref<HTMLDivElement | null>(null);
|
||||
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
|
||||
|
||||
onMounted(() => {
|
||||
console.log(props.listInfo);
|
||||
let xData: any = [];
|
||||
let yData: any = [];
|
||||
nextTick(() => {
|
||||
yearInfo.value = props.listInfo.list ? [props.listInfo.list[props.listInfo.list.length - 1]?.peYear, props.listInfo.list[0]?.peYear] : [];
|
||||
});
|
||||
console.log(yearInfo.value);
|
||||
props.listInfo.list &&
|
||||
props.listInfo.list.reverse().map((item) => {
|
||||
xData.push(item?.peYear);
|
||||
yData.push(item?.peResult);
|
||||
});
|
||||
setData(xData, yData);
|
||||
});
|
||||
|
||||
function setData(x, y) {
|
||||
setOptions(getOptions(x, [y]) as any);
|
||||
}
|
||||
|
||||
function changeDate(v) {
|
||||
console.log(v);
|
||||
return;
|
||||
let s: any = JSON.parse(v[0]);
|
||||
let e: any = JSON.parse(v[1]);
|
||||
let xData: any = [];
|
||||
let yData: any = [];
|
||||
props.listInfo.list &&
|
||||
props.listInfo.list.reverse().map((item) => {
|
||||
if (s <= JSON.parse(item?.peYear) && e >= JSON.parse(item?.peYear)) {
|
||||
xData.push(item?.peYear);
|
||||
yData.push(item?.peResult);
|
||||
}
|
||||
});
|
||||
setData(xData, yData);
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.d {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.container {
|
||||
min-height: 300px;
|
||||
}
|
||||
.table-d {
|
||||
background-color: #e6f7ff;
|
||||
color: #5c5c5c;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
border-top: 1px solid #f0f0f0;
|
||||
border-left: 1px solid #f0f0f0;
|
||||
> div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
border-right: 1px solid #f0f0f0;
|
||||
padding: 7px 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.table-d-1 {
|
||||
border-left: 1px solid #f0f0f0;
|
||||
> div {
|
||||
> div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
border-right: 1px solid #f0f0f0;
|
||||
padding: 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,173 @@
|
||||
<template>
|
||||
<div style="height: 100%" ref="containerRef">
|
||||
<div style="width: 100%; overflow: auto; height: 100%">
|
||||
<div class="table-d">
|
||||
<div style="width: 60px">序号</div>
|
||||
<div style="flex: 1">检查项目名称</div>
|
||||
<div style="width: 100px">异常率</div>
|
||||
<template v-for="(item, index) in lastYears" :key="`lastYears-${index}`">
|
||||
<div style="width: 100px">{{ item }}</div>
|
||||
</template>
|
||||
<div style="flex: 1">参考值</div>
|
||||
<div style="width: 120px">知识查询</div>
|
||||
<div style="width: 120px">历史趋势</div>
|
||||
</div>
|
||||
<div class="table-d-1">
|
||||
<!-- <template v-if="dataList.length > 0">-->
|
||||
<template v-for="(item, index) in dataList" :key="`dataList-${index}`">
|
||||
<div style="display: flex">
|
||||
<div style="width: 60px">{{ index + 1 }}</div>
|
||||
<div style="flex: 1">{{ item.name }}</div>
|
||||
<div style="width: 100px">
|
||||
<span style="color: red">{{ item.yc }}</span>
|
||||
/5
|
||||
</div>
|
||||
<template v-for="(it, index) in lastYears" :key="`lastYears-${index}`">
|
||||
<div style="width: 100px">{{ item[it] }}</div>
|
||||
</template>
|
||||
<div style="flex: 1">{{ item?.printContext + '' + item?.unit }}</div>
|
||||
<div style="width: 120px">
|
||||
<a-button type="link">知识查询</a-button>
|
||||
</div>
|
||||
<div style="width: 120px">
|
||||
<a-button type="link" @click="historyInfo(item)">历史趋势</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<!-- </template>-->
|
||||
<template v-if="dataList.length === 0">
|
||||
<a-empty style="padding-top: 10px" description="暂无数据" />
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref, watch } from 'vue';
|
||||
import { selectMedicalUniItemByClassIdApi, statusApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
|
||||
const containerRef = ref();
|
||||
const lastInfo = ref({});
|
||||
const lastYears = ref<any[]>([]);
|
||||
const dataList = ref<any[]>([]);
|
||||
|
||||
const props = defineProps({
|
||||
userId: {
|
||||
type: String,
|
||||
default: () => '',
|
||||
},
|
||||
medicalUniItemClassId: {
|
||||
type: String,
|
||||
default: () => '',
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['historyInfo']);
|
||||
|
||||
onMounted(async () => {
|
||||
await getLastYear();
|
||||
if (lastInfo.value?.reportLastYear) {
|
||||
for (let i = 0; i < 5; i++) {
|
||||
lastYears.value.push(lastInfo.value?.reportLastYear - i + '');
|
||||
}
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
|
||||
async function getLastYear() {
|
||||
try {
|
||||
lastInfo.value = await statusApi({ userId: props.userId });
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
|
||||
function historyInfo(record) {
|
||||
console.log(record);
|
||||
emit('historyInfo', record.listInfo);
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.medicalUniItemClassId,
|
||||
() => {
|
||||
getList();
|
||||
}
|
||||
);
|
||||
|
||||
async function getList() {
|
||||
try {
|
||||
let data = await selectMedicalUniItemByClassIdApi({ userId: props.userId, medicalUniItemClassId: props.medicalUniItemClassId });
|
||||
let t = {};
|
||||
dataList.value = data.map((item) => {
|
||||
t = { name: item?.peItemName, yc: 0, listInfo: item };
|
||||
lastYears.value.map((it) => {
|
||||
let c = item.list.find((c) => {
|
||||
return c.peYear === it;
|
||||
});
|
||||
|
||||
if (c) {
|
||||
t[it] = c?.peResult;
|
||||
t[it + '-tfRed'] = c?.tfRed;
|
||||
if (c.tfRed) {
|
||||
t['yc'] = t['yc'] + 1;
|
||||
}
|
||||
if (!t['printContext']) {
|
||||
t['printContext'] = c.printContext;
|
||||
}
|
||||
if (!t['unit']) {
|
||||
t['unit'] = c.unit;
|
||||
}
|
||||
} else {
|
||||
t[it] = '-';
|
||||
t[it + '-tfRed'] = false;
|
||||
}
|
||||
});
|
||||
if (!t['printContext']) {
|
||||
t['printContext'] = item.list.length > 0 ? item.list[0].printContext : '';
|
||||
}
|
||||
if (!t['unit']) {
|
||||
t['unit'] = item.list.length > 0 ? item.list[0].unit : '';
|
||||
}
|
||||
return t;
|
||||
});
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.table-d {
|
||||
background-color: #e6f7ff;
|
||||
color: #5c5c5c;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
border-top: 1px solid #f0f0f0;
|
||||
border-left: 1px solid #f0f0f0;
|
||||
> div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
border-right: 1px solid #f0f0f0;
|
||||
padding: 7px 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.table-d-1 {
|
||||
border-left: 1px solid #f0f0f0;
|
||||
> div {
|
||||
> div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
border-right: 1px solid #f0f0f0;
|
||||
padding: 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,168 @@
|
||||
<template>
|
||||
<div class="outer-5">
|
||||
<div style="height: 100%; overflow: hidden" v-show="pageValue === '0'">
|
||||
<div>
|
||||
<a-radio-group button-style="solid" style="margin-left: 5px" v-model:value="radioValue" @change="changeRadioValue">
|
||||
<a-radio-button value="0">疾病史</a-radio-button>
|
||||
<a-radio-button value="1">门诊档案</a-radio-button>
|
||||
<a-radio-button value="2">住院档案</a-radio-button>
|
||||
</a-radio-group>
|
||||
|
||||
<BasicTable @register="registerTable" :row-selection="rowSelection">
|
||||
<template v-if="radioValue !== '0' && props.editType !== '1'" #tableTitle>
|
||||
<a-button type="primary" @click="add">新增</a-button>
|
||||
<a-button type="primary" @click="edit">修改</a-button>
|
||||
<a-button type="primary" @click="del">删除</a-button>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex === 'diagnosis' || column.dataIndex === 'doctorAdvice'">
|
||||
<a-popover :title="column.customTitle" trigger="click">
|
||||
<template #content>
|
||||
<div style="width: 150px; max-height: 300px; overflow: auto">
|
||||
{{ record[column.dataIndex] }}
|
||||
</div>
|
||||
</template>
|
||||
<a-button type="link" @click.stop="() => {}">查看</a-button>
|
||||
</a-popover>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<tab5-detail
|
||||
ref="tab5Detail"
|
||||
@refresh="
|
||||
() => {
|
||||
pageValue = '0';
|
||||
reload();
|
||||
}
|
||||
"
|
||||
v-if="pageValue !== '0'"
|
||||
style="height: 100%; overflow: hidden"
|
||||
@go-back="() => (pageValue = '0')"
|
||||
:id="itemId"
|
||||
:userId="props.userInfo.id"
|
||||
:type="radioValue"
|
||||
/>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { nextTick, onMounted, ref } from 'vue';
|
||||
import BasicTable from '/@/components/Table/src/BasicTable.vue';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { tab5ReportColumns1, tab5ReportColumns2, tab5ReportColumns3 } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { allPageApi, deleteBatchApi, pageApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import Tab5Detail from '/@/views/archivesManage/employee/fileMaintenance/components/tab5/tab5Detail.vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
editType: {
|
||||
type: String,
|
||||
default: () => '0',
|
||||
},
|
||||
});
|
||||
|
||||
const pageValue = ref('0');
|
||||
const radioValue = ref('0');
|
||||
const itemId = ref('');
|
||||
|
||||
onMounted(() => {
|
||||
setProps({ api: allPageApi });
|
||||
});
|
||||
|
||||
function changeRadioValue(v) {
|
||||
switch (v.target.value) {
|
||||
case '0':
|
||||
setProps({ api: allPageApi, columns: tab5ReportColumns1, searchInfo: { userId: props.userInfo.id } });
|
||||
break;
|
||||
case '1':
|
||||
setProps({
|
||||
api: pageApi,
|
||||
columns: tab5ReportColumns2,
|
||||
searchInfo: { userId: props.userInfo.id, type: '0' },
|
||||
});
|
||||
break;
|
||||
case '2':
|
||||
setProps({
|
||||
api: pageApi,
|
||||
columns: tab5ReportColumns3,
|
||||
searchInfo: { userId: props.userInfo.id, type: '1' },
|
||||
});
|
||||
break;
|
||||
}
|
||||
selectedRows.value = [];
|
||||
selectedRowKeys.value = [];
|
||||
reload({ page: 1 });
|
||||
}
|
||||
|
||||
const { tableContext } = useListPage({
|
||||
tableProps: {
|
||||
title: '体检报告',
|
||||
columns: tab5ReportColumns1,
|
||||
api: allPageApi,
|
||||
canResize: false,
|
||||
searchInfo: {
|
||||
userId: props.userInfo.id,
|
||||
},
|
||||
tableSetting: {
|
||||
redo: true,
|
||||
setting: false,
|
||||
},
|
||||
showActionColumn: false,
|
||||
useSearchForm: false,
|
||||
actionColumn: {
|
||||
width: 120,
|
||||
fixed: 'right',
|
||||
},
|
||||
},
|
||||
});
|
||||
const [registerTable, { setProps, reload }, { rowSelection, selectedRowKeys, selectedRows }] = tableContext;
|
||||
function add() {
|
||||
itemId.value = '';
|
||||
pageValue.value = '1';
|
||||
nextTick(() => {
|
||||
tab5Detail.value.setInfo({ type: radioValue.value === '1' ? '0' : '1' });
|
||||
});
|
||||
}
|
||||
const tab5Detail = ref();
|
||||
function edit() {
|
||||
if (selectedRowKeys.value.length !== 1) return message.warn('请选择一条数据');
|
||||
itemId.value = selectedRowKeys.value[0];
|
||||
pageValue.value = '1';
|
||||
nextTick(() => {
|
||||
tab5Detail.value.setInfo({ ...selectedRows.value[0], type: radioValue.value === '1' ? '0' : '1' });
|
||||
});
|
||||
}
|
||||
function del() {
|
||||
if (selectedRowKeys.value.length === 0) return message.warn('请选择一条数据');
|
||||
itemId.value = selectedRowKeys.value[0];
|
||||
deleteBatchApi({ ids: selectedRowKeys.value.join(',') }, reload);
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.outer-4 {
|
||||
height: calc(100% - 46px);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
:deep(.ant-radio-button-wrapper) {
|
||||
color: #1684fc !important;
|
||||
border-color: #1684fc !important;
|
||||
&:before {
|
||||
background-color: #1684fc !important;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-radio-button-wrapper-checked) {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.no-select {
|
||||
:deep(.table-selection-column td) {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<div style="display: flex; width: 100%; align-items: center; justify-content: space-between">
|
||||
<div>
|
||||
<a-button type="primary" @click="() => emit('goBack')">返回</a-button>
|
||||
</div>
|
||||
<div style="font-size: 18px; font-weight: bold"> 新增{{ props.type === '1' ? '门诊' : '住院' }}档案 </div>
|
||||
<div> </div>
|
||||
</div>
|
||||
<div style="flex: 1; margin-top: 20px">
|
||||
<BasicForm @register="registerForm1" />
|
||||
<BasicForm @register="registerForm2" />
|
||||
</div>
|
||||
<div style="text-align: right; padding-right: 5px">
|
||||
<a-button type="primary" :loading="loading" @click="save">保存</a-button>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import BasicForm from '/@/components/Form/src/BasicForm.vue';
|
||||
import { useForm } from '/@/components/Form';
|
||||
import { tab5FormSchema1, tab5FormSchema2 } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { ref } from 'vue';
|
||||
import { saveApi, updateApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
|
||||
const props = defineProps({
|
||||
id: {
|
||||
type: String,
|
||||
default: () => '',
|
||||
},
|
||||
userId: {
|
||||
type: String,
|
||||
default: () => '',
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: () => '1',
|
||||
},
|
||||
});
|
||||
|
||||
const loading = ref(false);
|
||||
|
||||
const [registerForm1, { setFieldsValue: setFieldsValue1, validate: validate1, getFieldsValue }] = useForm({
|
||||
schemas: tab5FormSchema1,
|
||||
showActionButtonGroup: false,
|
||||
baseColProps: { span: 8 },
|
||||
labelWidth: 120,
|
||||
layout: 'inline',
|
||||
});
|
||||
const [registerForm2, { setFieldsValue: setFieldsValue2, validate: validate2 }] = useForm({
|
||||
schemas: tab5FormSchema2,
|
||||
showActionButtonGroup: false,
|
||||
baseColProps: { span: 24 },
|
||||
labelWidth: 120,
|
||||
});
|
||||
|
||||
function setInfo(record: Recordable) {
|
||||
setFieldsValue1({ ...record, id: props.id });
|
||||
setFieldsValue2({ ...record });
|
||||
}
|
||||
|
||||
async function save() {
|
||||
try {
|
||||
loading.value = true;
|
||||
let v1 = await validate1();
|
||||
let v2 = await validate2();
|
||||
if (props.id) {
|
||||
await updateApi({ ...v1, ...v2, userId: props.userId });
|
||||
} else {
|
||||
await saveApi({ ...v1, ...v2, userId: props.userId });
|
||||
}
|
||||
emit('refresh');
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
const emit = defineEmits(['goBack', 'refresh']);
|
||||
|
||||
defineExpose({
|
||||
setInfo,
|
||||
});
|
||||
</script>
|
||||
<style scoped lang="less"></style>
|
||||
@@ -0,0 +1,120 @@
|
||||
<template>
|
||||
<div class="outer-6">
|
||||
<div style="text-align: right" v-if="props.editType !== '1'">
|
||||
<a-button v-show="!isUpdate" type="primary" @click="() => (isUpdate = true)">编辑</a-button>
|
||||
<a-button v-show="isUpdate" type="primary" @click="save">保存</a-button>
|
||||
<a-button style="margin-left: 10px" v-show="isUpdate" type="primary" @click="cancel">取消</a-button>
|
||||
</div>
|
||||
<div class="item-d-outer">
|
||||
<div class="item-d">
|
||||
<div>亲缘关系</div>
|
||||
<div>疾病一</div>
|
||||
<div>疾病二</div>
|
||||
<div>疾病三</div>
|
||||
<div>疾病四</div>
|
||||
<div>疾病五</div>
|
||||
</div>
|
||||
<div class="item-d" v-for="(item, index) in dataList" :key="`item-d-${index}`">
|
||||
<div> {{ item.familyRelation_dictText }} </div>
|
||||
<div>
|
||||
<span v-if="!isUpdate">{{ item['illnessOne'] || '-' }}</span>
|
||||
<a-input v-else v-model:value="item['illnessOne']" />
|
||||
</div>
|
||||
<div>
|
||||
<span v-if="!isUpdate">{{ item['illnessTwo'] || '-' }}</span>
|
||||
<a-input v-else v-model:value="item['illnessTwo']" />
|
||||
</div>
|
||||
<div>
|
||||
<span v-if="!isUpdate">{{ item['illnessThree'] || '-' }}</span>
|
||||
<a-input v-else v-model:value="item['illnessThree']" />
|
||||
</div>
|
||||
<div>
|
||||
<span v-if="!isUpdate">{{ item['illnessFour'] || '-' }}</span>
|
||||
<a-input v-else v-model:value="item['illnessFour']" />
|
||||
</div>
|
||||
<div>
|
||||
<span v-if="!isUpdate">{{ item['illnessFive'] || '-' }}</span>
|
||||
<a-input v-else v-model:value="item['illnessFive']" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { tab6EditApi, tab6PageApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
editType: {
|
||||
type: String,
|
||||
default: () => '0',
|
||||
},
|
||||
});
|
||||
const dataList = ref();
|
||||
const isUpdate = ref();
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
|
||||
async function getList() {
|
||||
try {
|
||||
dataList.value = (await tab6PageApi({ userId: props.userInfo.id })).records;
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
async function save() {
|
||||
try {
|
||||
dataList.value.map((item) => {
|
||||
item['userId'] = props.userInfo.id;
|
||||
return item;
|
||||
});
|
||||
await tab6EditApi(dataList.value);
|
||||
await getList();
|
||||
isUpdate.value = false;
|
||||
} catch (e) {}
|
||||
}
|
||||
function cancel() {
|
||||
getList();
|
||||
isUpdate.value = false;
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.outer-4 {
|
||||
height: calc(100% - 46px);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.item-d-outer {
|
||||
flex: 1;
|
||||
margin-top: 10px;
|
||||
overflow: auto;
|
||||
border-bottom: 1px solid #c1c1c1;
|
||||
border-left: 1px solid #c1c1c1;
|
||||
> div:nth-child(1) {
|
||||
> div {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-d {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
> div {
|
||||
width: calc(100% / 6);
|
||||
border-top: 1px solid #c1c1c1;
|
||||
border-right: 1px solid #c1c1c1;
|
||||
text-align: center;
|
||||
padding: 10px 0;
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
width: 95%;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,199 @@
|
||||
<template>
|
||||
<div class="tab8-content">
|
||||
<div class="top">
|
||||
<div class="top-left">
|
||||
<a-tabs v-model:activeKey="activeKey" @change="changeTabs">
|
||||
<a-tab-pane key="1" tab="全部"></a-tab-pane>
|
||||
<a-tab-pane key="2" tab="选时"></a-tab-pane>
|
||||
<a-tab-pane key="3" tab="日"></a-tab-pane>
|
||||
<a-tab-pane key="4" tab="周"></a-tab-pane>
|
||||
<a-tab-pane key="5" tab="月"></a-tab-pane>
|
||||
<a-tab-pane key="6" tab="季"></a-tab-pane>
|
||||
<a-tab-pane key="7" tab="年"></a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
<div class="top-right">
|
||||
<a-radio-group v-model:value="sportType" button-style="solid" @change="handleChange">
|
||||
<a-radio-button value="0">步数</a-radio-button>
|
||||
<a-radio-button value="1">锻炼</a-radio-button>
|
||||
</a-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
<div class="center" v-if="showPicker">
|
||||
<a-date-picker v-model:value="dateValue" :picker="pickerType" v-if="!showRangePicker" @change="changeDate" />
|
||||
|
||||
<a-range-picker v-model:value="rangeValue" v-if="showRangePicker" @change="changeRange" />
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<BasicTable @register="registerTable" table-type="0">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<div v-if="column.dataIndex == 'source'">穿戴设备</div>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { BasicTable } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { tab8Column } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import { tab8SdsApi, tab8WorkApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import dayjs from 'dayjs';
|
||||
import weekday from 'dayjs/plugin/weekday';
|
||||
import quarterOfYear from 'dayjs/plugin/quarterOfYear';
|
||||
dayjs.extend(weekday);
|
||||
dayjs.extend(quarterOfYear);
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
editType: {
|
||||
type: String,
|
||||
default: () => '0',
|
||||
},
|
||||
});
|
||||
const sportType = ref('0');
|
||||
const { tableContext } = useListPage({
|
||||
tableProps: {
|
||||
api: tab8SdsApi,
|
||||
columns: tab8Column(sportType.value),
|
||||
useSearchForm: false,
|
||||
showActionColumn: false,
|
||||
beforeFetch: (params) => {
|
||||
params.userId = props.userInfo?.id;
|
||||
return params;
|
||||
},
|
||||
},
|
||||
});
|
||||
const [registerTable, { reload, setProps }] = tableContext;
|
||||
const activeKey = ref('1');
|
||||
const pickerType = ref('');
|
||||
const showRangePicker = ref(false);
|
||||
const dateValue = ref(dayjs(new Date()));
|
||||
const rangeValue = ref([dayjs(new Date().setDate(new Date().getDate() - 7)), dayjs(new Date())]);
|
||||
const showPicker = ref(false);
|
||||
function changeTabs() {
|
||||
showRangePicker.value = false;
|
||||
showPicker.value = true;
|
||||
switch (activeKey.value) {
|
||||
case '1':
|
||||
showPicker.value = false;
|
||||
break;
|
||||
case '2':
|
||||
showRangePicker.value = true;
|
||||
break;
|
||||
case '3':
|
||||
pickerType.value = '';
|
||||
break;
|
||||
case '4':
|
||||
pickerType.value = 'week';
|
||||
break;
|
||||
case '5':
|
||||
pickerType.value = 'month';
|
||||
break;
|
||||
case '6':
|
||||
pickerType.value = 'quarter';
|
||||
break;
|
||||
case '7':
|
||||
pickerType.value = 'year';
|
||||
break;
|
||||
}
|
||||
updataTable();
|
||||
}
|
||||
function handleChange() {
|
||||
console.log(sportType.value);
|
||||
setProps({
|
||||
columns: tab8Column(sportType.value),
|
||||
api: sportType.value == '0' ? tab8SdsApi : tab8WorkApi,
|
||||
});
|
||||
reload();
|
||||
}
|
||||
function changeDate() {
|
||||
updataTable();
|
||||
}
|
||||
function changeRange() {
|
||||
updataTable();
|
||||
}
|
||||
function updataTable() {
|
||||
let startOfWeek;
|
||||
let endOfWeek;
|
||||
if (activeKey.value == '1') {
|
||||
startOfWeek = '';
|
||||
endOfWeek = '';
|
||||
} else if (activeKey.value == '2') {
|
||||
startOfWeek = rangeValue.value ? rangeValue.value[0].format('YYYY-MM-DD') : '';
|
||||
endOfWeek = rangeValue.value ? rangeValue.value[1].format('YYYY-MM-DD') : '';
|
||||
} else {
|
||||
switch (activeKey.value) {
|
||||
case '3':
|
||||
startOfWeek = dayjs(dateValue.value).startOf('day').format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(dateValue.value).endOf('day').format('YYYY-MM-DD');
|
||||
break;
|
||||
case '4':
|
||||
startOfWeek = dayjs(dateValue.value).startOf('week').format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(dateValue.value).endOf('week').format('YYYY-MM-DD');
|
||||
break;
|
||||
case '5':
|
||||
startOfWeek = dayjs(dateValue.value).startOf('month').format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(dateValue.value).endOf('month').format('YYYY-MM-DD');
|
||||
break;
|
||||
case '6':
|
||||
const quarter = dayjs(dateValue.value).quarter();
|
||||
if (quarter === 1) {
|
||||
startOfWeek = dayjs(`${dayjs(dateValue.value).year()}-01-01`).format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(`${dayjs(dateValue.value).year()}-03-31`).format('YYYY-MM-DD');
|
||||
} else if (quarter === 2) {
|
||||
startOfWeek = dayjs(`${dayjs(dateValue.value).year()}-04-01`).format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(`${dayjs(dateValue.value).year()}-06-30`).format('YYYY-MM-DD');
|
||||
} else if (quarter === 3) {
|
||||
startOfWeek = dayjs(`${dayjs(dateValue.value).year()}-07-01`).format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(`${dayjs(dateValue.value).year()}-09-30`).format('YYYY-MM-DD');
|
||||
} else if (quarter === 4) {
|
||||
startOfWeek = dayjs(`${dayjs(dateValue.value).year()}-10-01`).format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(`${dayjs(dateValue.value).year()}-12-31`).format('YYYY-MM-DD');
|
||||
}
|
||||
// startOfWeek = dayjs(dateValue.value).startOf('quarter').format('YYYY-MM-DD');
|
||||
// endOfWeek = dayjs(dateValue.value).endOf('quarter').format('YYYY-MM-DD');
|
||||
break;
|
||||
case '7':
|
||||
startOfWeek = dayjs(dateValue.value).startOf('year').format('YYYY-MM-DD');
|
||||
endOfWeek = dayjs(dateValue.value).endOf('year').format('YYYY-MM-DD');
|
||||
break;
|
||||
}
|
||||
}
|
||||
setProps({
|
||||
beforeFetch: (parmas) => {
|
||||
parmas.userId = props.userInfo?.id;
|
||||
parmas.startTime = startOfWeek;
|
||||
parmas.endTime = endOfWeek;
|
||||
return parmas;
|
||||
},
|
||||
});
|
||||
reload({ page: 1 });
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.tab8-content {
|
||||
.top {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
.top-left {
|
||||
:deep(.ant-tabs-nav) {
|
||||
width: 100% !important;
|
||||
}
|
||||
:deep(.ant-tabs-tab-active) {
|
||||
background: #fff !important;
|
||||
}
|
||||
}
|
||||
.top-right {
|
||||
:deep(.ant-radio-button-wrapper) {
|
||||
width: 100px !important;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div>
|
||||
<div v-show="!showView">
|
||||
<a-radio-group v-model:value="radioType" button-style="solid" @change="changeRadio">
|
||||
<a-radio-button value="0">吸烟</a-radio-button>
|
||||
<a-radio-button value="1">饮酒</a-radio-button>
|
||||
</a-radio-group>
|
||||
<BasicTable @register="registerTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<div v-if="column.dataIndex == 'detail'">
|
||||
<a-button type="link" @click="handleDetail(record)">问卷内容</a-button>
|
||||
</div>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</div>
|
||||
<Tab9Detail v-show="showView && info" @go-back="goBack" :info="info" :type="radioType"></Tab9Detail>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { BasicTable } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPages';
|
||||
import { tab9ListApi } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.api';
|
||||
import { tab9Column, tab9Column1 } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
import Tab9Detail from '/@/views/archivesManage/employee/fileMaintenance/components/tab9/tab9Detail.vue';
|
||||
const radioType = ref('0');
|
||||
const props = defineProps({
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
const showView = ref(false);
|
||||
const { tableContext, onExportXls } = useListPage({
|
||||
tableProps: {
|
||||
api: tab9ListApi,
|
||||
columns: radioType.value == '0' ? tab9Column : tab9Column1,
|
||||
useSearchForm: false,
|
||||
showIndexColumn: true,
|
||||
beforeFetch: (params) => {
|
||||
params.userId = props.userInfo.id;
|
||||
params.type = radioType.value;
|
||||
return params;
|
||||
},
|
||||
},
|
||||
});
|
||||
const [registerTable, { reload, setColumns, setProps }] = tableContext;
|
||||
const info = ref();
|
||||
function changeRadio() {
|
||||
setProps({
|
||||
columns: radioType.value == '0' ? tab9Column : tab9Column1,
|
||||
beforeFetch: (params) => {
|
||||
params.userId = props.userInfo.id;
|
||||
params.type = radioType.value;
|
||||
return params;
|
||||
},
|
||||
});
|
||||
reload();
|
||||
}
|
||||
function goBack() {
|
||||
showView.value = false;
|
||||
reload();
|
||||
}
|
||||
function handleDetail(record) {
|
||||
info.value = record;
|
||||
showView.value = true;
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,149 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="title">
|
||||
<a-button type="primary" @click="goBack" class="addBtn">返回</a-button>
|
||||
<div class="name">{{ props.type == '0' ? '吸烟' : '喝酒' }}-问卷内容</div>
|
||||
</div>
|
||||
<div v-if="info && type == '0'" class="smoke">
|
||||
<!-- <BasicForm @register="registerForm" />-->
|
||||
<div>
|
||||
<span>调查时间：{{ info?.createTime ? info?.createTime : '--' }}</span>
|
||||
</div>
|
||||
<div class="smoke-detail">
|
||||
<div class="label">（1）吸烟状况</div>
|
||||
<span class="value">
|
||||
<!-- <a-space direction="vertical">-->
|
||||
<!-- <a-radio-group disabled v-model:value="smokingStatus" :options="smokeOptions" />-->
|
||||
<!-- </a-space>-->
|
||||
{{ info?.smokingStatus == 0 ? '吸烟' : info?.smokingStatus == 1 ? '已戒烟' : '从不吸烟' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="smoke-detail">
|
||||
<div class="label">（2）每天吸几根烟</div>
|
||||
<span class="value">{{ info?.roots ? info?.roots : '--' }}根</span>
|
||||
</div>
|
||||
<div class="smoke-detail">
|
||||
<div class="label">（3）开始吸烟的年龄</div>
|
||||
<span class="value">{{ info?.smokingAge ? info?.smokingAge : '--' }}岁</span>
|
||||
</div>
|
||||
<div class="smoke-detail">
|
||||
<div class="label">（4）和您一起工作的人是否有人吸烟？</div>
|
||||
<span class="value">{{ info?.passiveSmoking == 0 ? '有' : '没有' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="info && type == '1'" class="wine">
|
||||
<div>
|
||||
<span>调查时间：{{ info?.createTime ? info?.createTime : '--' }}</span>
|
||||
</div>
|
||||
<div class="wine-detail">
|
||||
<div class="label">（1）饮酒状况</div>
|
||||
<span class="value">
|
||||
<!-- <a-space direction="vertical">-->
|
||||
<!-- <a-radio-group disabled v-model:value="smokingStatus" :options="wineOptions" />-->
|
||||
<!-- </a-space>-->
|
||||
{{ info?.drinkStatus == 0 ? '饮酒' : info?.drinkStatus == 1 ? '已戒酒' : '从不饮酒' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="wine-detail">
|
||||
<div class="label">（2）喝酒的频次和两数</div>
|
||||
<div class="value">
|
||||
<div v-for="(item, index) in beerType" :key="index" class="wine-class">
|
||||
<span> {{ item.label }}</span>
|
||||
<div>
|
||||
<span class="num">{{ info[item.value] ? info[item.value].drinkUnit : '--' }}</span>
|
||||
次/周，
|
||||
</div>
|
||||
<div>
|
||||
<span class="num">{{ info[item.value] ? info[item.value].frequency : '--' }}</span>
|
||||
两/次
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { beerType } from '/@/views/archivesManage/employee/fileMaintenance/maintenance.data';
|
||||
const props = defineProps({
|
||||
info: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: '0',
|
||||
},
|
||||
});
|
||||
const smokeOptions = [
|
||||
{ label: '吸烟', value: 0 },
|
||||
{ label: '已戒烟', value: 1 },
|
||||
{ label: '从不吸烟', value: 2 },
|
||||
];
|
||||
const wineOptions = [
|
||||
{ label: '饮酒', value: 0 },
|
||||
{ label: '已戒酒', value: 1 },
|
||||
{ label: '从不饮酒', value: 2 },
|
||||
];
|
||||
const smokingStatus = ref(2);
|
||||
const emit = defineEmits(['go-back']);
|
||||
|
||||
onMounted(() => {
|
||||
smokingStatus.value = props.type == '0' ? props.info?.smokingStatus : props.info?.drinkStatus;
|
||||
});
|
||||
function goBack() {
|
||||
emit('go-back');
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
justify-content: space-around;
|
||||
.addBtn {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
}
|
||||
.name {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.smoke {
|
||||
margin: 20px;
|
||||
.smoke-detail {
|
||||
.label {
|
||||
font-weight: bold;
|
||||
margin: 20px 0;
|
||||
}
|
||||
.value {
|
||||
margin: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.wine {
|
||||
margin: 20px;
|
||||
.wine-detail {
|
||||
.label {
|
||||
font-weight: bold;
|
||||
margin: 20px 0;
|
||||
}
|
||||
.value {
|
||||
margin: 20px;
|
||||
.wine-class {
|
||||
display: flex;
|
||||
margin: 20px;
|
||||
.num {
|
||||
display: inline-block;
|
||||
width: 50px;
|
||||
border: 2px solid rgba(0, 0, 0, 0.5);
|
||||
margin: 0 5px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user