newPeter7
2 years ago
38 changed files with 197 additions and 12175 deletions
@ -1,112 +0,0 @@ |
|||
<template> |
|||
<div class="component-wrapper"> |
|||
<div class="year-select"> |
|||
<el-select v-model="yearSelect" placeholder="请选择"> |
|||
<el-option v-for="item2 in years" :key="item2.value" :label="item2.label" :value="item2.value" /> |
|||
</el-select> |
|||
</div> |
|||
<div v-for="(item,index) in progressList" :key="index" v-loading="progressLoading" class="heatmap-wrapper"> |
|||
<div class="heatmap-head"> |
|||
<span class="heatmap-title">{{ item.name }}</span> |
|||
<span> {{ yearSelect }} </span> |
|||
</div> |
|||
<div class="heatmap-container"> |
|||
<calendar-heatmap :data-list="item.data||[]" :end-date="endDate" class="heatmap" /> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
// import Cookies from 'js-cookie' |
|||
// window.SITE_CONFIG['dict_examItem'] |
|||
|
|||
import calendarHeatmap from '@/components/calendar-heatmap' |
|||
|
|||
export default { |
|||
components: { |
|||
calendarHeatmap |
|||
}, |
|||
data() { |
|||
return { |
|||
progressLoading: false, |
|||
progressList: [], |
|||
yearSelect: (new Date()).getFullYear(), |
|||
endDate: String((new Date()).getFullYear()) + '-12-31' |
|||
} |
|||
}, |
|||
computed: { |
|||
years() { |
|||
const result = [] |
|||
const thisYear = Number((new Date()).getFullYear()) |
|||
for (let i = 0; i < 10; i++) { |
|||
result.push({ |
|||
label: thisYear - i, |
|||
value: thisYear - i |
|||
}) |
|||
} |
|||
return result |
|||
} |
|||
}, |
|||
watch: { |
|||
yearSelect(val) { |
|||
this.getProgressList(val) |
|||
} |
|||
}, |
|||
created() { this.getProgressList() }, |
|||
mounted() { }, |
|||
methods: { |
|||
getProgressList(year) { |
|||
this.progressLoading = true |
|||
year = year || String((new Date()).getFullYear()) |
|||
const startDate = year + '-01-01' |
|||
const endDate = year + '-12-31' |
|||
this.endDate = endDate |
|||
// this.progressLoading = true |
|||
this.$http.get('/stats/examItem/allExtract', { params: { startDate, endDate }}) |
|||
.then(({ data: res }) => { |
|||
this.progressList = res.data |
|||
window.sessionStorage.setItem('progressList', JSON.stringify(this.progressList)) |
|||
this.progressLoading = false |
|||
}).catch(() => { this.progressLoading = false }) |
|||
} |
|||
} |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style lang='scss' scoped> |
|||
.component-wrapper { |
|||
min-height: 200px; |
|||
|
|||
.year-select{ |
|||
display: flex; |
|||
justify-content: center; |
|||
margin-bottom: 10px; |
|||
} |
|||
|
|||
.heatmap-wrapper { |
|||
margin-bottom: 10px; |
|||
|
|||
.heatmap-head { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
|
|||
.heatmap-title { |
|||
padding: 0 20px; |
|||
font-size: 16px; |
|||
font-weight: bolder; |
|||
} |
|||
} |
|||
|
|||
.heatmap-container { |
|||
min-height: 130px; |
|||
// padding-left: 170px; |
|||
|
|||
.heatmap { |
|||
height: 100%; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -1,112 +0,0 @@ |
|||
<template> |
|||
<div v-loading="progressLoading" class="component-wrapper"> |
|||
<div class="heatmap-wrapper"> |
|||
<div class="heatmap-head"> |
|||
<div class="heatmap-title"> |
|||
<el-select v-model="itemSelect" size="mini" placeholder="请选择" style="width:250px" filterable> |
|||
<el-option v-for="item in items" :key="item.itemId" :label="item.itemName" :value="item.itemId" /> |
|||
</el-select> |
|||
</div> |
|||
<div class="year-select"> |
|||
<el-select v-model="yearSelect" size="mini" placeholder="请选择" style="width:80px"> |
|||
<el-option v-for="item in years" :key="item.value" :label="item.label" :value="item.value" /> |
|||
</el-select> |
|||
</div> |
|||
</div> |
|||
<div class="heatmap-container"> |
|||
<calendar-heatmap :data-list="dataList" :end-date="endDate" class="heatmap" /> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import calendarHeatmap from '@/components/calendar-heatmap' |
|||
|
|||
export default { |
|||
components: { |
|||
calendarHeatmap |
|||
}, |
|||
data() { |
|||
return { |
|||
progressLoading: false, |
|||
dataList: [], |
|||
itemSelect: window.SITE_CONFIG['dict_examItem'][0].itemId, |
|||
yearSelect: (new Date()).getFullYear(), |
|||
endDate: String((new Date()).getFullYear()) + '-12-31' |
|||
} |
|||
}, |
|||
computed: { |
|||
years() { |
|||
const result = [] |
|||
const thisYear = Number((new Date()).getFullYear()) |
|||
for (let i = 0; i < 10; i++) { |
|||
result.push({ |
|||
label: thisYear - i, |
|||
value: thisYear - i |
|||
}) |
|||
} |
|||
return result |
|||
}, |
|||
items() { |
|||
return window.SITE_CONFIG['dict_examItem'] |
|||
} |
|||
}, |
|||
watch: { |
|||
yearSelect() { |
|||
this.getProgressList() |
|||
}, |
|||
itemSelect() { |
|||
this.getProgressList() |
|||
} |
|||
}, |
|||
created() { this.getProgressList() }, |
|||
mounted() { }, // this.itemSelect = window.SITE_CONFIG['dict_examItem'][8].itemId |
|||
methods: { |
|||
getProgressList() { |
|||
this.progressLoading = true |
|||
const year = this.yearSelect |
|||
const startDate = year + '-01-01' |
|||
const endDate = year + '-12-31' |
|||
this.endDate = endDate |
|||
this.$http.get('/stats/examItem/extract', { params: { code: this.itemSelect, startDate, endDate }}) |
|||
.then(({ data: res }) => { |
|||
this.dataList = res.data |
|||
this.progressLoading = false |
|||
}).catch(() => { this.progressLoading = false }) |
|||
} |
|||
} |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style lang='scss' scoped> |
|||
.component-wrapper { |
|||
min-height: 200px; |
|||
|
|||
.heatmap-wrapper { |
|||
margin-bottom: 10px; |
|||
|
|||
.heatmap-head { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
margin-bottom: 20px; |
|||
|
|||
.heatmap-title { |
|||
padding: 0 20px; |
|||
font-size: 16px; |
|||
font-weight: bolder; |
|||
} |
|||
} |
|||
|
|||
.heatmap-container { |
|||
min-height: 130px; |
|||
// padding-left: 170px; |
|||
|
|||
.heatmap { |
|||
height: 100%; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -1,72 +0,0 @@ |
|||
<template> |
|||
<el-table :data="data" class="table-wrapper" :show-header="showHeader" style="width: 100%"> |
|||
<el-table-column type="index" width="44" /> |
|||
<el-table-column prop="name" :label="colTitle" width="150" show-overflow-tooltip /> |
|||
<!-- <el-table-column prop="num" :label="colNum" header-align="center" width="100" align="left" /> --> |
|||
<el-table-column header-align="center" min-width="150" align="left"> |
|||
<!-- scope.row.num --> |
|||
<template slot-scope="scope"> |
|||
<el-progress :stroke-width="10" :percentage="toPercentage(scope.row.num)" :format="format" /> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
props: { |
|||
data: { type: Array, required: true }, |
|||
showHeader: { type: Boolean, default: false }, |
|||
colTitle: { type: String, default: '排名' }, |
|||
colNum: { type: String, default: '数量' } |
|||
}, |
|||
data() { |
|||
return { |
|||
totalNum: 0, |
|||
valMap: {} |
|||
} |
|||
}, |
|||
watch: { |
|||
data: { |
|||
deep: true, |
|||
handler(newVal, oldVal) { |
|||
this.data.forEach(item => { |
|||
this.totalNum += item.num || 0 |
|||
}) |
|||
}, |
|||
immediate: true |
|||
} |
|||
}, |
|||
methods: { |
|||
toPercentage(val) { |
|||
if (val === 0 || this.totalNum === 0) return 0 |
|||
const perVal = (Math.round(val / this.totalNum * 10000) / 100)// 小数点后两位百分比 |
|||
this.valMap[perVal] = val |
|||
return perVal |
|||
}, |
|||
format(percentage) { |
|||
return this.valMap[percentage] |
|||
} |
|||
} |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.table-wrapper { |
|||
|
|||
::v-deep .el-table th { |
|||
background-color: transparent; |
|||
} |
|||
|
|||
::v-deep .el-table td, |
|||
::v-deep .el-table th.is-leaf { |
|||
border-bottom: 0px; |
|||
} |
|||
|
|||
::v-deep .el-progress-bar__inner, |
|||
::v-deep .el-progress-bar__outer { |
|||
border-radius: 0%; |
|||
} |
|||
} |
|||
</style> |
|||
@ -1,7 +0,0 @@ |
|||
import RenDeptTree from './src/ren-dept-tree' |
|||
|
|||
RenDeptTree.install = function(Vue) { |
|||
Vue.component(RenDeptTree.name, RenDeptTree) |
|||
} |
|||
|
|||
export default RenDeptTree |
|||
@ -1,121 +0,0 @@ |
|||
<template> |
|||
<div> |
|||
<el-input v-model="showDeptName" :placeholder="placeholder" @focus="deptDialog"> |
|||
<el-button slot="append" icon="el-icon-search" @click="deptDialog" /> |
|||
</el-input> |
|||
<el-input :value="value" style="display: none" /> |
|||
<el-dialog :visible.sync="visibleDept" width="30%" :modal="false" :title="placeholder" :close-on-click-modal="false" :close-on-press-escape="false"> |
|||
<el-form size="mini" :inline="true"> |
|||
<el-form-item :label="$t('keyword')"> |
|||
<el-input v-model="filterText" /> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="default">{{ $t('query') }}</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
<el-tree |
|||
ref="tree" |
|||
class="filter-tree" |
|||
:data="deptList" |
|||
:default-expanded-keys="expandedKeys" |
|||
:props="{ label: 'name', children: 'children' }" |
|||
:expand-on-click-node="false" |
|||
:filter-node-method="filterNode" |
|||
:highlight-current="true" |
|||
node-key="id" |
|||
/> |
|||
<template slot="footer"> |
|||
<el-button type="default" size="mini" @click="cancelHandle()">{{ $t('cancel') }}</el-button> |
|||
<el-button v-if="query" type="info" size="mini" @click="clearHandle()">{{ $t('clear') }}</el-button> |
|||
<el-button type="primary" size="mini" @click="commitHandle()">{{ $t('confirm') }}</el-button> |
|||
</template> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
export default { |
|||
name: 'RenDeptTree', |
|||
props: { |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
value: [Number, String], |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
deptName: String, |
|||
query: Boolean, |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
placeholder: String |
|||
}, |
|||
data() { |
|||
return { |
|||
filterText: '', |
|||
visibleDept: false, |
|||
deptList: [], |
|||
showDeptName: '', |
|||
expandedKeys: null, |
|||
defaultProps: { |
|||
children: 'children', |
|||
label: 'label' |
|||
} |
|||
} |
|||
}, |
|||
watch: { |
|||
filterText(val) { |
|||
this.$refs.tree.filter(val) |
|||
}, |
|||
deptName(val) { |
|||
this.showDeptName = val |
|||
} |
|||
}, |
|||
methods: { |
|||
deptDialog() { |
|||
this.expandedKeys = null |
|||
if (this.$refs.tree) { |
|||
this.$refs.tree.setCurrentKey(null) |
|||
} |
|||
this.visibleDept = true |
|||
this.getDeptList(this.value) |
|||
}, |
|||
filterNode(value, data) { |
|||
if (!value) return true |
|||
return data.name.indexOf(value) !== -1 |
|||
}, |
|||
getDeptList(id) { |
|||
return this.$http.get('/sys/dept/list').then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg) |
|||
} |
|||
this.deptList = res.data |
|||
this.$nextTick(() => { |
|||
this.$refs.tree.setCurrentKey(id) |
|||
this.expandedKeys = [id] |
|||
}) |
|||
}).catch(() => {}) |
|||
}, |
|||
cancelHandle() { |
|||
this.visibleDept = false |
|||
this.deptList = [] |
|||
this.filterText = '' |
|||
}, |
|||
clearHandle() { |
|||
this.$emit('input', '') |
|||
this.$emit('update:deptName', '') |
|||
this.showDeptName = '' |
|||
this.visibleDept = false |
|||
this.deptList = [] |
|||
this.filterText = '' |
|||
}, |
|||
commitHandle() { |
|||
const node = this.$refs.tree.getCurrentNode() |
|||
if (!node) { |
|||
this.$message.error(this.$t('dept.chooseerror')) |
|||
return |
|||
} |
|||
this.$emit('input', node.id) |
|||
this.$emit('update:deptName', node.name) |
|||
this.showDeptName = node.name |
|||
this.visibleDept = false |
|||
this.deptList = [] |
|||
this.filterText = '' |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
@ -1,7 +0,0 @@ |
|||
import RenRadioGroup from './src/ren-radio-group' |
|||
|
|||
RenRadioGroup.install = function(Vue) { |
|||
Vue.component(RenRadioGroup.name, RenRadioGroup) |
|||
} |
|||
|
|||
export default RenRadioGroup |
|||
@ -1,22 +0,0 @@ |
|||
<template> |
|||
<el-radio-group :value="value+''" @input="$emit('input', $event)"> |
|||
<el-radio v-for="data in dataList" :key="data.dictValue" :label="data.dictValue">{{ data.dictLabel }}</el-radio> |
|||
</el-radio-group> |
|||
</template> |
|||
<script> |
|||
import { getDictDataList } from '@/utils' |
|||
export default { |
|||
name: 'RenRadioGroup', |
|||
props: { |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
value: [Number, String], |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
dictType: String |
|||
}, |
|||
data() { |
|||
return { |
|||
dataList: getDictDataList(this.dictType) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
@ -1,7 +0,0 @@ |
|||
import RenRegionTree from './src/ren-region-tree' |
|||
|
|||
RenRegionTree.install = function(Vue) { |
|||
Vue.component(RenRegionTree.name, RenRegionTree) |
|||
} |
|||
|
|||
export default RenRegionTree |
|||
@ -1,135 +0,0 @@ |
|||
<template> |
|||
<div class="ren-region"> |
|||
<el-input v-model="showName" :placeholder="placeholder" @focus="treeDialog"> |
|||
<el-button slot="append" icon="el-icon-search" @click="treeDialog" /> |
|||
</el-input> |
|||
<el-input :value="value" style="display: none" /> |
|||
<el-dialog :visible.sync="visibleTree" width="360px" :modal="false" :title="placeholder" :close-on-click-modal="false" :close-on-press-escape="false"> |
|||
<el-form size="mini" :inline="true"> |
|||
<el-form-item :label="$t('keyword')"> |
|||
<el-input v-model="filterText" /> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="default">{{ $t('query') }}</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
<el-tree |
|||
ref="tree" |
|||
class="filter-tree" |
|||
:data="dataList" |
|||
:default-expanded-keys="expandedKeys" |
|||
:props="{ label: 'name', children: 'children' }" |
|||
:expand-on-click-node="false" |
|||
:filter-node-method="filterNode" |
|||
:highlight-current="true" |
|||
node-key="id" |
|||
/> |
|||
<template slot="footer"> |
|||
<el-button type="default" size="mini" @click="cancelHandle()">{{ $t('cancel') }}</el-button> |
|||
<el-button type="info" size="mini" @click="clearHandle()">{{ $t('clear') }}</el-button> |
|||
<el-button type="primary" size="mini" @click="commitHandle()">{{ $t('confirm') }}</el-button> |
|||
</template> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
<style lang="scss"> |
|||
.ren-region { |
|||
.filter-tree { |
|||
max-height: 230px; |
|||
overflow: auto; |
|||
} |
|||
.el-dialog__body { |
|||
padding: 0px 0px 0px 20px; |
|||
} |
|||
.el-dialog__footer { |
|||
padding: 10px 20px 8px 20px; |
|||
} |
|||
} |
|||
</style> |
|||
<script> |
|||
import { treeDataTranslate } from '@/utils' |
|||
export default { |
|||
name: 'RenRegionTree', |
|||
props: { |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
value: [Number, String], |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
parentName: String, |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
placeholder: String |
|||
}, |
|||
data() { |
|||
return { |
|||
filterText: '', |
|||
visibleTree: false, |
|||
dataList: [], |
|||
showName: '', |
|||
expandedKeys: null, |
|||
defaultProps: { |
|||
children: 'children', |
|||
label: 'name' |
|||
} |
|||
} |
|||
}, |
|||
watch: { |
|||
filterText(val) { |
|||
this.$refs.tree.filter(val) |
|||
}, |
|||
parentName(val) { |
|||
this.showName = val |
|||
} |
|||
}, |
|||
methods: { |
|||
treeDialog() { |
|||
this.expandedKeys = null |
|||
if (this.$refs.tree) { |
|||
this.$refs.tree.setCurrentKey(null) |
|||
} |
|||
this.visibleTree = true |
|||
this.getDataList(this.value) |
|||
}, |
|||
filterNode(value, data) { |
|||
if (!value) return true |
|||
return data.name.indexOf(value) !== -1 |
|||
}, |
|||
getDataList(id) { |
|||
return this.$http.get('/sys/region/tree').then(({ data: res }) => { |
|||
if (res.code !== 0) { |
|||
return this.$message.error(res.msg) |
|||
} |
|||
this.dataList = treeDataTranslate(res.data) |
|||
this.$nextTick(() => { |
|||
this.$refs.tree.setCurrentKey(id) |
|||
this.expandedKeys = [id] |
|||
}) |
|||
}).catch(() => {}) |
|||
}, |
|||
cancelHandle() { |
|||
this.visibleTree = false |
|||
this.dataList = [] |
|||
this.filterText = '' |
|||
}, |
|||
clearHandle() { |
|||
this.$emit('input', '0') |
|||
this.$emit('update:parentName', '') |
|||
this.showName = '' |
|||
this.visibleTree = false |
|||
this.dataList = [] |
|||
this.filterText = '' |
|||
}, |
|||
commitHandle() { |
|||
const node = this.$refs.tree.getCurrentNode() |
|||
if (!node) { |
|||
this.$message.error(this.$t('choose')) |
|||
return |
|||
} |
|||
this.$emit('input', node.id) |
|||
this.$emit('update:parentName', node.name) |
|||
this.showName = node.name |
|||
this.visibleTree = false |
|||
this.dataList = [] |
|||
this.filterText = '' |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
@ -1,7 +0,0 @@ |
|||
import RenSelect from './src/ren-select' |
|||
|
|||
RenSelect.install = function(Vue) { |
|||
Vue.component(RenSelect.name, RenSelect) |
|||
} |
|||
|
|||
export default RenSelect |
|||
@ -1,24 +0,0 @@ |
|||
<template> |
|||
<el-select :value="value+''" :placeholder="placeholder" clearable @input="$emit('input', $event)"> |
|||
<el-option v-for="data in dataList" :key="data.dictValue" :label="data.dictLabel" :value="data.dictValue">{{ data.dictLabel }}</el-option> |
|||
</el-select> |
|||
</template> |
|||
<script> |
|||
import { getDictDataList } from '@/utils' |
|||
export default { |
|||
name: 'RenSelect', |
|||
props: { |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
value: [Number, String], |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
dictType: String, |
|||
// eslint-disable-next-line vue/require-default-prop |
|||
placeholder: String |
|||
}, |
|||
data() { |
|||
return { |
|||
dataList: getDictDataList(this.dictType) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
@ -1,404 +0,0 @@ |
|||
<template> |
|||
<div class="component-container searchContent"> |
|||
<!-- max-height="450" --> |
|||
<el-table |
|||
ref="registerPatientsListTable" |
|||
:data="dataList" |
|||
style="width: 100%" |
|||
class="examine-table" |
|||
:show-header="conCiseShow == true ? true : false" |
|||
@="handleSelectionChange" |
|||
@select="headleSelect" |
|||
> |
|||
<el-table-column v-if="projectName == 'sampleBank'" type="selection" width="55" :selectable="selectable" /> |
|||
<!-- 简洁版 --> |
|||
<template v-if="conCiseShow == true"> |
|||
<!-- 姓名 --> |
|||
<el-table-column :label="'姓名'" header-align="center" align="center" width="120"> |
|||
<template slot-scope="scope"> |
|||
{{ scope.row.register_patient.name | f_desensitize_name }} |
|||
</template> |
|||
</el-table-column> |
|||
<!-- 性别 --> |
|||
<el-table-column :label="'性别'" header-align="center" align="center"> |
|||
<template slot-scope="scope"> |
|||
{{ scope.row.register_patient.sex | f_sex }} |
|||
</template> |
|||
</el-table-column> |
|||
<!-- 年龄 --> |
|||
<el-table-column :label="'年龄'" header-align="center" align="center"> |
|||
<template slot-scope="scope"> |
|||
{{ scope.row.register_patient.birthday | f_getAge }} |
|||
</template> |
|||
</el-table-column> |
|||
<!-- 身份证号 --> |
|||
<el-table-column prop="patientIdNumber" :label="'身份证号'" header-align="center" align="center"> |
|||
<template slot-scope="scope"> |
|||
{{ scope.row.register_patient.patientIdNumber | f_desensitize_idNumber }} |
|||
</template> |
|||
</el-table-column> |
|||
<!-- 电话号码 备用--> |
|||
<!-- <el-table-column |
|||
prop="patientPhone" |
|||
:label="'电话号码'" |
|||
header-align="center" |
|||
align="center" |
|||
> |
|||
<template slot-scope="scope"> |
|||
{{ scope.row.register_patient.patientPhone }} |
|||
</template> |
|||
</el-table-column> --> |
|||
<!-- 地址 备用--> |
|||
<!-- <el-table-column |
|||
prop="patientAddress" |
|||
:label="'地址'" |
|||
header-align="center" |
|||
align="center" |
|||
> |
|||
<template slot-scope="scope"> |
|||
{{ scope.row.register_patient.patientAddress }} |
|||
</template> |
|||
</el-table-column> --> |
|||
<!-- 操作 --> |
|||
<el-table-column label="操作" header-align="center" align="center" width="150"> |
|||
<template slot-scope="scope"> |
|||
<el-button type="text" size="small" @click="showDetail(scope.row)">查看详情 |
|||
</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</template> |
|||
<!-- 标准版 --> |
|||
<template v-if="conCiseShow == false"> |
|||
<!-- 姓名 --> |
|||
<el-table-column header-align="center"> |
|||
<template slot-scope="scope"> |
|||
<div class="head"> |
|||
<div class="left"> |
|||
<!-- <el-checkbox :label="id">{{ "" }}</el-checkbox> --> |
|||
<div class="left"> |
|||
<span>姓名：{{ scope.row.register_patient.name }}</span> |
|||
<span>性别：{{ scope.row.register_patient.sex }}</span> |
|||
<!-- <span>年龄：{{ registerPatient.patientSexAge }}</span> --> |
|||
</div> |
|||
</div> |
|||
<div class="right"> |
|||
<el-link type="primary" :underline="false" @click="showDetail(scope.row)">查看详情 <i |
|||
class="el-icon-arrow-right el-icon--right" |
|||
/></el-link> |
|||
</div> |
|||
</div> |
|||
<div class="searchContent-text" v-html="scope.row.allHighlight" /> |
|||
<div class="exam"> |
|||
<p v-for="(item, index) in scope.row.pacs_register_examine_item" :key="index"> |
|||
<span>{{ item.examineItem }}</span> |
|||
<span>{{ item.count + "次" }}</span> |
|||
</p> |
|||
</div> |
|||
|
|||
<el-row :gutter="20"> |
|||
<el-col :span="12"> |
|||
<echarts-shili :chart-data="scope.row.shili" :id-name="'shili' + scope.$index" desc="视力" /> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<echarts-yanya :chart-data="scope.row.yanya" :id-name="'yanya' + scope.$index" desc="眼压" /> |
|||
</el-col> |
|||
</el-row> |
|||
</template> |
|||
</el-table-column> |
|||
</template> |
|||
</el-table> |
|||
<!-- 底部全选反选 --> |
|||
<checked-footer |
|||
v-if="projectName == 'sampleBank'" |
|||
ref="checkfooter" |
|||
table-ref="registerPatientsListTable" |
|||
:current-table-list="currentTableList" |
|||
:data-list="dataList" |
|||
> |
|||
<div class="batch_button"> |
|||
<el-button type="primary" size="small" @click="IntoSubjectsClick">引入受试者</el-button> |
|||
</div> |
|||
</checked-footer> |
|||
<!-- 详情页 --> |
|||
<el-dialog title="360视图" class="detail-view" :visible.sync="dialogVisible" :fullscreen="true"> |
|||
<detail-view :id="detailId" ref="viewRef" :patient-id-number="patientIdNumber" /> |
|||
</el-dialog> |
|||
<!-- 补全身份证号 --> |
|||
<el-dialog title="收货地址" :visible.sync="dialogPatientIDVisible" @closed="closePatientId"> |
|||
<span>身份证:</span> |
|||
<el-input v-model="patientIdNumber" placeholder="请输入内容" clearable /> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button @click="dialogPatientIDVisible=false">取 消</el-button> |
|||
<el-button type="primary" @click="surePatientIdClick">确 定</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import echartsShili from '@/components/echarts/shili' |
|||
import echartsYanya from '@/components/echarts/yanya' |
|||
import checkedFooter from '@/components/checked-footer' |
|||
import detailView from '@/components/360View/index1' |
|||
import checked from '@/mixins/checked' |
|||
import { confirm } from '@/utils/confirm' |
|||
export default { |
|||
components: { echartsShili, echartsYanya, detailView, checkedFooter }, |
|||
mixins: [checked], |
|||
inject: ['refresh'], |
|||
props: { |
|||
id: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
htmlText: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
projectName: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
registerPatient: { |
|||
type: Object, |
|||
default: () => { |
|||
return {} |
|||
} |
|||
}, |
|||
dataList: { |
|||
type: Array, |
|||
default: () => [] |
|||
}, |
|||
visionData: { |
|||
type: Array, |
|||
default: () => [] |
|||
}, |
|||
iopData: { |
|||
type: Array, |
|||
default: () => [] |
|||
}, |
|||
conCiseShow: { |
|||
type: Boolean, |
|||
default: true |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
dialogVisible: false, |
|||
dialogPatientIDVisible: false, |
|||
detailId: '', |
|||
patientIdNumber: '', |
|||
checked: false, |
|||
// cheackAllFooter: false, |
|||
currentTableList: [], |
|||
projectId: '', |
|||
noPatientIDList: {}, |
|||
currentSelectionRow: {}, |
|||
flag: 0 |
|||
} |
|||
}, |
|||
created() { |
|||
this.projectId = window.SITE_CONFIG['projectId'] |
|||
}, |
|||
methods: { |
|||
// 查看详情 |
|||
showDetail(scope) { |
|||
this.patientIdNumber = scope.register_patient.patientIdNumber |
|||
this.detailId = scope.id |
|||
this.dialogVisible = true |
|||
this.$nextTick(() => { |
|||
// 根据id获取患者信息--中间上侧患者信息 |
|||
this.$refs.viewRef.getPatientData() |
|||
// 获取时间轴数据--左侧时间轴 |
|||
this.$refs.viewRef.getTimeAxisData() |
|||
// 获取视力和眼压图标的值 |
|||
this.$refs.viewRef.getShiLiAndYanYaData() |
|||
// 获取关键指标--右侧获取筛选的具体值 |
|||
this.$refs.viewRef.getKPI() |
|||
}) |
|||
}, |
|||
// 当选择项发生变化时会触发该事件 |
|||
handleSelectionChange(val) { |
|||
if (val.length === this.dataList.length) { |
|||
this.$refs.checkfooter.cheackAllFooter = true |
|||
} else { |
|||
this.$refs.checkfooter.cheackAllFooter = false |
|||
} |
|||
this.currentTableList = val |
|||
}, |
|||
// 当用户手动勾选数据行的 Checkbox 时触发的事件 |
|||
headleSelect(val) { |
|||
// 330104195404061636 |
|||
this.flag = 0 |
|||
this.currentSelectionRow = val[0] |
|||
if (val.length > 0 && !val[0].register_patient.patientIdNumber) { |
|||
this.noPatientIDList = val[0].register_patient |
|||
this.dialogPatientIDVisible = true |
|||
} |
|||
}, |
|||
// 确定添加身份证号 |
|||
async surePatientIdClick() { |
|||
const { data: res } = await this.$http.post('/project/patient/completeIdNumber', { |
|||
birthday: this.$options.filters['dateFilterTwo'](this.noPatientIDList.birthday), |
|||
hospitalId: this.noPatientIDList.hospitalId, |
|||
name: this.noPatientIDList.name, |
|||
patientId: this.noPatientIDList.id, |
|||
patientIdNumber: this.patientIdNumber, |
|||
sex: this.noPatientIDList.sex |
|||
}) |
|||
if (res.code === 0) { |
|||
this.$message({ |
|||
type: 'success', |
|||
message: '身份证号添加成功' |
|||
}) |
|||
this.flag = 1 |
|||
this.dialogPatientIDVisible = false |
|||
} else { |
|||
this.flag = 0 |
|||
this.$message.error(res.msg) |
|||
} |
|||
}, |
|||
// 关闭添加身份证号弹框 |
|||
closePatientId() { |
|||
this.dialogPatientIDVisible = false |
|||
this.flag === 0 ? this.$refs.registerPatientsListTable.toggleRowSelection(this.currentSelectionRow, false) : '' |
|||
}, |
|||
// 引入受试者 |
|||
IntoSubjectsClick() { |
|||
confirm('确定要引入受试者吗?').then(async() => { |
|||
const patientInfoArr = [] |
|||
let patientInfoObj = {} |
|||
this.currentTableList.forEach((item) => { |
|||
patientInfoObj = { |
|||
hospitalCode: item.register_patient.hospitalId, |
|||
patientBirthday: item.register_patient.birthday, |
|||
patientId: item.register_patient.id, |
|||
patientIdNumber: item.register_patient.patientIdNumber, |
|||
patientName: item.register_patient.name, |
|||
patientSex: item.register_patient.sex, |
|||
projectId: this.projectId |
|||
} |
|||
patientInfoArr.push(patientInfoObj) |
|||
}) |
|||
const { data: res } = await this.$http({ |
|||
method: 'post', |
|||
url: '/project/patient', |
|||
data: patientInfoArr |
|||
}) |
|||
if (res.code === 0) { |
|||
this.$message({ |
|||
type: 'success', |
|||
message: '引入成功!' |
|||
}) |
|||
this.currentTableList.forEach(item => { |
|||
this.dataList.forEach(iten => { |
|||
if (item.id === iten.id) { |
|||
item.existInProject = 1 |
|||
} |
|||
}) |
|||
}) |
|||
this.$refs.registerPatientsListTable.clearSelection() |
|||
} else { |
|||
this.$message.error(res.msg) |
|||
} |
|||
}) |
|||
}, |
|||
// Function 的返回值用来决定这一行的 CheckBox 是否可以勾选 |
|||
selectable(row, index) { |
|||
if (row.existInProject === 1) { |
|||
return false |
|||
} else { |
|||
return true |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.searchContent { |
|||
width: 100%; |
|||
padding-bottom: 16px; |
|||
background-color: #fff; |
|||
margin-bottom: 16px; |
|||
.head { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
.el-checkbox { |
|||
margin-right: 16px; |
|||
} |
|||
.left { |
|||
display: flex; |
|||
span { |
|||
font-size: 14px; |
|||
padding-right: 55px; |
|||
font-weight: bold; |
|||
} |
|||
} |
|||
} |
|||
.searchContent-text { |
|||
font-size: 14px; |
|||
margin: 16px 0; |
|||
} |
|||
.exam { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
p { |
|||
display: flex; |
|||
flex-wrap: nowrap; |
|||
height: 32px; |
|||
line-height: 32px; |
|||
width: 18%; |
|||
background-color: #eee; |
|||
padding: 0 10px; |
|||
margin: 6px; |
|||
span { |
|||
display: block; |
|||
flex: 1; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
text-overflow: ellipsis; |
|||
} |
|||
span:nth-child(2) { |
|||
padding-left: 14px; |
|||
color: #0072f9; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
a.el-link.el-link--primary:hover { |
|||
text-decoration: none; |
|||
} |
|||
</style> |
|||
|
|||
<style lang="scss"> |
|||
.searchContent .detail-view { |
|||
.el-dialog { |
|||
background: #000; |
|||
overflow: hidden; |
|||
} |
|||
|
|||
.el-dialog__header { |
|||
padding: 10px 20px 10px; |
|||
|
|||
.el-dialog__title { |
|||
color: #fff; |
|||
padding: 10px; |
|||
} |
|||
|
|||
.el-dialog__headerbtn { |
|||
top: 5px; |
|||
font-size: 30px; |
|||
} |
|||
.el-dialog__headerbtn .el-dialog__close { |
|||
color: #fff; |
|||
} |
|||
} |
|||
.el-dialog__body { |
|||
height: calc(100vh - 60px); |
|||
padding: 0 10px; |
|||
} |
|||
} |
|||
</style> |
|||
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
Loading…
Reference in new issue