Skip to content

P
pica.cloud.web-education-admin
提交 24cacef7 编写于 作者: chengxiang.li's avatar chengxiang.li
浏览文件
操作

update

上级 cbd17c5d
显示空白字符变更
内嵌 并排
正在显示 包含 468 行增加 和 149 行删除
src/utils/patients/patientsapi.js
浏览文件 @ 24cacef7
......@@ -39,17 +39,14 @@ export const getDiseasesList = (params) => {
};
// 新增居民
export const getUploadHistory = data => {
export const getUploadHistory = params => { // 获取上传历史记录
return fetch({
// url: getBaseUrl(`healths/labels/`),
url: 'https://dev-kf.yunqueyi.com/api/ImpPatMapping/init',
headers: {
noSysCode: true,
"Content-Type": 'application/json'
},
method: 'post',
data: data,
description: '新增分组',
headers,
url: getBaseUrl(`/healths/docImpPat/import/records`),
method: 'get',
params: params,
description: '获取上传历史记录',
})
}
......
src/views/patients/new-manage/new-patient.vue
浏览文件 @ 24cacef7
<template>
<div class="newly-increased-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" ></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<p class="top-title">新增居民</p>
<el-tabs v-model="activeName2" type="card" @tab-click="handleTabClick" class="tab-list">
<el-tab-pane label="单个录入" name="first">单个录入11</el-tab-pane>
<el-tab-pane label="二维码录入" name="second">二维码录入22</el-tab-pane>
<div class="component-content screenSet">
<el-tabs v-model="activeName2" @tab-click="handleTabClick" class="tab-list">
<el-tab-pane label="单个录入" name="first" class="single-input">
<el-row class="save-and-add">
<el-button type="primary">保存并新增</el-button>
</el-row>
</el-tab-pane>
<el-tab-pane label="二维码录入" name="second">
<div class="qr-code-wrap">
<el-alert
class="top-tips"
title="提醒：选择分组后，会自动生成相应的分组二维码，居民扫码后直接进入该分组（若未选择分组，则自动生成未分组二维码，居民扫码后进入默认未分组）"
type="warning"
show-icon>
</el-alert>
<div class="qr-group">
<p class="label-name">二维码分组：</p>
<el-tag size="small">糖尿病高危分组</el-tag>
<el-tag size="small">高血压分组</el-tag>
<el-tag size="small" class="choose-group">+ 选择分组</el-tag>
</div>
<div class="qr-pic-wrap">
<div class="qr-box">
<div class="pic">
<div class="img" style="width: 200px; height: 200px;"></div>
<el-button icon="el-icon-download" class="qr-download-btn">下载二维码</el-button>
</div>
<p class="time-limit">有效期：2019.5.1-2019.5.30 </p>
<el-button icon="el-icon-refresh" class="refresh-btn" size="small">刷新有效期</el-button>
</div>
</div>
<div class="border-space"></div>
<div class="increased-steps-wrap">
<div class="label-title">居民添加流程</div>
<ul>
<li></li>
</ul>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="批量导入" name="third">
<div class="step-guide"></div>
<div class="step-guide">
<ul class="guide-list">
<li class="first">
<div class="procedure">
<i class="icon">1</i>
<p class="text">下载模板</p>
<p class="border"></p>
</div>
<div class="under-info">
<p class="step-tips">点击下方“下载模板”</p>
<el-button type="primary" size="small" @click="handleDownloadDemo">下载模板</el-button>
</div>
</li>
<li class="first second">
<div class="procedure">
<i class="icon">2</i>
<p class="text">填写居民信息</p>
<p class="border"></p>
</div>
<div class="under-info">
<p class="step-tips">按照模板编辑居民信息</p>
<ul class="fill-tips">
<li>
<i class="tips-title notice">填写要求：</i>
</li>
<li>
<i class="tips-title">居民姓名：</i>
<p>当前支持2~15个字符</p>
</li>
<li>
<i class="tips-title">出生年月：</i>
<p>"年-月-日"，我们将优先识别身份证信息中的出生年月信息，若身份证未填，将识别此处信息。</p>
</li>
<li>
<i class="tips-title">居住地址：</i>
<p>≤50字</p>
</li>
<li>
<i class="tips-title">电话：</i>
<p>请输入11为手机号码</p>
</li>
<li>
<i class="tips-title">分组与诊断：</i>
<p>多个分组之间，用中文逗号“，”分割</p>
</li>
</ul>
</div>
</li>
<li class="first third">
<div class="procedure">
<i class="icon">3</i>
<p class="text">上传文件</p>
</div>
<div class="under-info">
<p class="step-tips">将填写好的居民信息文件在下方进行上传</p>
<el-upload
class="upload-file"
drag
:action="uploadUrl"
:headers="uploadHeaders"
:file-list="files"
:on-change="changeFile"
:on-error="uploadError"
:on-success="uploadSuccess"
:show-file-list="false"
:multiple="false">
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
<!-- <div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div> -->
</el-upload>
</div>
</li>
</ul>
</div>
<div class="component-content screenSet upload-history-wrap">
<p class="septal-line"></p>
<p class="upload-record">上传历史记录：120</p>
<el-table
:data="searchData.tableData"
class="upload-table"
height="100"
style="width: 100%">
<el-table-column
header-align="center"
align="center"
prop="date"
prop="fileName"
label="文件名"
width="180">
</el-table-column>
<el-table-column
header-align="center"
align="center"
prop="name"
prop="uploadTime"
label="上传时间"
width="180">
</el-table-column>
<el-table-column
header-align="center"
align="center"
prop="address"
prop="insertCount"
label="新导入居民数">
</el-table-column>
<el-table-column
header-align="center"
align="center"
prop="address"
prop="updateCount"
label="更新居民资料数">
</el-table-column>
<el-table-column
header-align="center"
align="center"
prop="address"
prop="status"
label="处理状态">
</el-table-column>
<el-table-column
......@@ -57,15 +166,17 @@
class="pagination-style"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="searchData.totalRows"
:total="searchData.totalCount"
:current-page="1"
:page-sizes="[10, 30, 50, 100]"
:page-size="searchData.pageSize"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</div>
</el-tab-pane>
</el-tabs>
</div>
</div>
</template>
......@@ -75,67 +186,28 @@
import {
getUploadHistory
} from "@/utils/patients/patientsapi";
import { getSaasDomain } from '@/utils/index';
export default {
data() {
return {
curmbFirst: "居民管理",
curmbSecond: "新增居民",
activeName2: 'third',
activeName2: 'second',
searchData: {
pageNo: 1, // 第几页
pageSize: 10, // 每页条数
tableData: [{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
}, {
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
},{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
}, {
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
},{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
}, {
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}],
totalRows: 0,
}
tableData: [],
totalCount: 0,
},
uploadUrl: `${getSaasDomain('web/patientManages/import')}`,
uploadHeaders: {
token: localStorage.getItem('token')
},
files: [],
}
},
components: {
......@@ -147,30 +219,87 @@
},
// 挂载到Dom完成时
mounted() {
commonUtil.resizeHeight();
// commonUtil.resizeHeight();
},
methods: {
goToGetUploadHistory(){
console.log('go get upload history>>>>>>')
// let params = {
// model: {"doctor_id":101281458},
// pageNo: 1,
// pageSize: 15,
// }
let params = {"token":"8C036BF566E742059AC951DBDA8941CA","model":{"doctor_id":101281458},"pageSize":15,"pageNo":1};
getUploadHistory(params).then(data => {
console.log('go get upload record: ', data)
let params = {
pageNo: this.searchData.pageNo,
pageSize: this.searchData.pageSize,
};
getUploadHistory(params).then(res => {
console.log('获取上传历史记录：', res);
if(res.code == "000000"){
if(res.data.importRecordsModelList.length > 0){
this.searchData.tableData = res.data.importRecordsModelList;
this.searchData.totalCount = res.data.count;
}
}else{
// 获取失败
this.$message({
message: '接口返回失败，请重新再试',
type: 'warning'
});
}
})
},
handleTabClick(tab, event) {
console.log(tab, event);
},
handleSizeChange(val){
handleCurrentChange(val) {
this.searchData.pageNo = val;
this.goToGetUploadHistory();
},
handleSizeChange(val) {
this.searchData.pageSize = val;
this.goToGetUploadHistory();
},
handleDownloadDemo(){
window.open('https://file.yunqueyi.com/File/template/居民导入模板.xlsx');
},
changeFile(file, fileList) {
const name = file.name;
const type = name.substring(name.lastIndexOf('.') + 1);
if (type !== 'xls' && type !== 'xlsx') {
this.$message({
message: '上传文件只能是 xls、xlsx格式!',
type: 'warning'
});
fileList.splice(0, 1);
return false;
}
if (fileList.length > 1) {
fileList.splice(0, 1);
}
this.files = [file];
},
handleCurrentChange(val){
uploadError(err, file, fileList){
console.log('%c upload Error >>>>>>>>', 'color: red;')
},
uploadSuccess(response, file, fileList) {
console.log('%c upload Success >>>>>>>>', 'color: red;')
// this.loading = false;
// this.visible = false;
// this.tipShow = true;
console.log('response: ', response);
console.log('file: ', file);
console.log('fileList: ', fileList)
// console.log(response, file, fileList);
const { code } = response;
this.code = response.code;
const codes = ['000000', '400002', '400004'];
if (codes.indexOf(code) > -1) {
this.error = response.data;
} else {
this.error = response.message;
}
},
}
}
......@@ -183,12 +312,27 @@
padding: 30px;
display: flex;
flex-direction: column;
&.upload-history-wrap{
margin-top: 30px;
margin: 0;
padding: 0;
.septal-line{
width: 100%;
height: 1px;
background: #EBEEF5;
}
}
}
.top-title{
font-size: 20px;
padding-bottom: 20px;
border-bottom: 1px solid #efefef;
}
.single-input{
.save-and-add{
text-align: right;
}
}
}
</style>
......@@ -197,31 +341,145 @@
.top-title{
border: 0 !important;
}
.upload-record{
width: 100%;
font-size: 20px;
line-height: 28px;
color: #1E2F3D;
background: #fff;
margin: 30px 0 24px;
}
.pagination-style{
text-align: right;
margin-top: 20px;
}
.tab-list{
flex: 1;
display: flex;
flex-direction: column;
.el-tabs__item{
color: #303133;
font-weight: 600;
letter-spacing: 1px;
}
.el-tabs__active-bar{
background-color: #449284;
}
.el-tabs__content{
flex: 1;
overflow: hidden;
.el-tab-pane{
width: 100%;
height: 100%;
background: #F0F2F5;
overflow: hidden;
display: flex;
flex-direction: column;
.step-guide{
width: 100%;
background: #fff;
.guide-list{
width: 100%;
height: 237px;
margin-top: 15px;
.first{
width: 308px;
// width: 30%;
height: 200px;
background: pink;
float: left;
.procedure{
width: 100%; height: 20px;
.icon{
width: 20px;
height: 20px;
display: inline-block;
background: #449284;
border-radius: 20px;
text-align: center; line-height: 20px;
font-size: 12px; color: #fff;
}
.upload-record{
.text{
display: inline-block;
font-size: 14px;
color: #262626;
font-weight: 600;
}
.border{
display: inline-block;
width: 200px;
// width: 70%;
height: 0px;
border-bottom: 1px solid #449284;
vertical-align: middle;
}
&::after{
content: '';
height: 100%;
display: inline-block;
vertical-align: middle;
}
}
.under-info{
padding-left: 25px;
.step-tips{
width: 100%;
font-size: 12px;
line-height: 30px;
color: #595959;
margin: 8px 0 20px;
}
}
}
.second{
width: 380px;
// width: 40%;
.procedure{
.border{
width: 250px;
// width: 70%;
}
}
.under-info{
.fill-tips{
li{
font-size: 12px;
width: 300px;
line-height: 18px;
.tips-title{
display: inline-block;
color: #262626;
font-weight: 600;
&.notice{
color: #449284;
}
}
p{
display: inline;
color: #595959;
}
}
}
}
}
.third{
width: 300px;
// width: 30%;
.el-upload{
width: 260px;
height: 150px;
}
.el-upload-dragger{
width: 260px;
// width: 100%;
height: 150px;
}
}
}
}
.upload-table{
flex: 1;
}
.el-table__body-wrapper{
&::-webkit-scrollbar
......@@ -238,15 +496,79 @@
}
}
}
}
.pagination-style{
text-align: right;
margin-top: 20px;
.qr-code-wrap{
background: #fff;
.qr-group{
width: 100%; height:auto;
overflow: hidden;
margin: 30px 0 40px;
.label-name{
display: inline-block;
font-size: 12px;
color: #8C8C8C;
}
.el-tag{
color: #449284;
background:rgba(236,244,242,1);
border:1px solid rgba(150,195,193,1);
margin-left: 10px;
&.choose-group{
color: #666666;
background:rgba(255,255,255,1);
border:1px dashed rgba(217,217,217,1);
cursor: pointer;
}
}
}
.qr-pic-wrap{
width: 100%; height: auto;
.qr-box{
width: 200px;
margin: 0 auto;
text-align: center;
.pic{
background:rgba(240,242,245,1);
width: 200px; height: auto;
border: 0;
.qr-download-btn{
color: #fff;
background: #449284;
width: 200px;
border: 0;
}
}
.time-limit{
width: 100%;
text-align: center;
color: #8C8C8C;
font-size: 12px;
line-height: 41px;
}
.refresh-btn{
color: #449284;
background:rgba(236,244,242,1);
border:1px solid rgba(150,195,193,1);
}
}
}
.border-space{
width: 100%;
height: 1px;
background: #EBEEF5;
margin-top: 30px;
}
.increased-steps-wrap{
.label-title{
font-size: 20px;
color: #1E2F3D;
line-height: 28px;
margin: 30px 0 24px;
}
}
}
}
}
</style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或