Skip to content

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

update

上级 6dcfe169
隐藏空白字符变更
内嵌 并排
正在显示 包含 394 行增加 和 23 行删除
src/utils/patients/patientsapi.js
浏览文件 @ 15e2a878
......@@ -74,17 +74,35 @@ export const getDiseasesList = (params) => {
};
// 新增居民
export const getQRCode = data => {
return fetch({
headers,
url: getBaseUrl(`healths/qrcodes/get`),
method: 'post',
data: data,
description: '获取二维码',
})
}
export const getUploadHistory = params => { // 获取上传历史记录
export const getUploadHistory = params => {
return fetch({
headers,
url: getBaseUrl(`/healths/docImpPat/import/records`),
url: getBaseUrl(`healths/docImpPat/import/records`),
method: 'get',
params: params,
description: '获取上传历史记录',
})
}
export const refreshCode = data => {
return fetch({
headers,
url: getBaseUrl(`healths/qrcodes/refresh`),
method: 'post',
data: data,
description: '刷新二维码有效期',
})
}
// 分组管理
export const getLabelList = (params) => {
......
src/views/patients/labels-manage/labels-detail.vue
浏览文件 @ 15e2a878
......@@ -72,6 +72,7 @@
</div>
</el-table>
<el-pagination
v-if="searchData.tableData && searchData.tableData.length > 0"
class="pagination-style"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
......@@ -201,7 +202,7 @@
},
// 挂载到Dom完成时
mounted() {
commonUtil.resizeHeight();
// commonUtil.resizeHeight();
},
methods: {
getDetail() {
......@@ -284,6 +285,7 @@
},
handleChangeLabelName(){
this.showChangeLabelNameDialog = true;
this.ruleForm.newLabelName = this.$route.query.labelName;
},
cancelChangeName(){
this.isChangeNameError = false;
......@@ -417,8 +419,30 @@
}
</script>
<style lang="less">
.label-detail-wrap{
.err-text{
height: 12px;
// display: none;
visibility: hidden;
}
.special-error-tips{
.el-textarea__inner{
border: 1px solid red;
outline: none;
}
.err-text{
color: red;
visibility: visible;
}
}
}
</style>
<style lang="less" scoped>
.label-detail-wrap{
.screenSet{
background: #fff;
padding: 30px;
......@@ -470,11 +494,13 @@
}
.pagination-style{
text-align: right;
margin: 20px 0;
}
.table-empty{
width: 100%;
height: auto;
text-align: center;
margin-top: 20%;
.empty-pic{
width: 100px;
height: 100px;
......@@ -486,6 +512,7 @@
font-size: 14px;
color: #909399;
line-height: 14px;
padding-bottom: 200px;
}
}
}
......
src/views/patients/labels-manage/labels-list.vue
浏览文件 @ 15e2a878
......@@ -21,7 +21,7 @@
</el-button>
</el-col>
</el-row>
<p class="total-label">共：{{labelNameList.length}}个分组</p>
<p class="total-label">共：{{totalListCount}}个分组</p>
<div class="label-list" v-if="labelNameList && labelNameList.length > 0">
<el-tag class="each-label" @click="goToDetail(item)" v-for="(item, index) in labelNameList" :key="index">{{item.labelName}}({{item.labelPatientNums}}人)</el-tag>
</div>
......@@ -70,6 +70,7 @@
curmbSecond: "分组管理",
labelName: '',
labelNameList: [],
totalListCount: 0,
centerDialogVisible: false,
ruleForm: {
newLabelName: '', // 新建分组名
......@@ -98,17 +99,23 @@
// 获取分组列表
let params = {
type: 1,
token : localStorage.getItem("token"),
};
if(this.labelName){
params.labelName = this.labelName;
}
commonUtil.openLoading(this);
// commonUtil.openLoading(this);
getLabelList(params).then(data => {
commonUtil.closeLoading(this);
// commonUtil.closeLoading(this);
// console.log('获取分组列表>> ', data)
if(data.data && data.data.labelNameList){
this.labelNameList = data.data.labelNameList;
for(let i=0; i<this.labelNameList.length; i++){
if(this.labelNameList[i].labelId == 0){
this.totalListCount = this.labelNameList.length - 1;
}else{
this.totalListCount = this.labelNameList.length;
}
}
}
}).catch(err => {
console.log('error: ', err)
......
src/views/patients/new-manage/new-patient.vue
浏览文件 @ 15e2a878
......@@ -18,28 +18,98 @@
</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>
<template v-for="labelItem in currentLabelList">
<el-tag size="small" :key="labelItem">{{labelItem}}</el-tag>
</template>
<el-tag size="small" class="choose-group" @click="handleChooseGroup">+ 选择分组</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>
<!-- <vue-qr :text="qrCodeInfo.qrcodeUrl" class="qr-code-img"></vue-qr> -->
<canvas id="msg"></canvas>
<el-button icon="el-icon-download" class="qr-download-btn" @click="handleQRDownloadModal">下载二维码</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>
<p class="time-limit">有效期：{{qrCodeInfo.beginTime}}-{{qrCodeInfo.endTime}} </p>
<el-button icon="el-icon-refresh" class="refresh-btn" size="small" @click="handleRefreshCode">刷新有效期</el-button>
</div>
</div>
<div class="border-space"></div>
<div class="increased-steps-wrap">
<div class="label-title">居民添加流程</div>
<ul>
<li></li>
</ul>
<img src="../../../assets/image/patient-add-flow-path.png" alt="" class="flow-path">
</div>
</div>
<!-- 选择分组 弹窗 -->
<el-dialog
class="choose-label-wrap"
title="选择分组"
:visible.sync="showChooseLabelModal"
width="680px"
:close-on-click-modal="false"
center>
<p class="under-title-tips">选择分组后，会自动生成相应的分组二维码，居民扫码后直接进入该分组</p>
<el-row class="row-in-line">
<el-button size="small" class="clear-select" :disabled="choosedLabelList.length<1" @click="handleClearSelect">清空选择</el-button>
<el-button type="primary" class="right" size="small" @click="handleGoToLabelManage">分组管理</el-button>
<p class="tips">未找到分组可去分组管理新建分组</p>
</el-row>
<div class="list-wrap">
<el-checkbox-group v-model="choosedLabelList">
<template v-for="item in labelNameList" >
<el-checkbox v-if="item.labelId != 0" :label="item.labelId" border :key="item.labelId">
{{item.labelName}}
</el-checkbox>
</template>
</el-checkbox-group>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="showChooseLabelModal = false" size="small">取 消</el-button>
<el-button type="primary" @click="handleAfterChooseLabel" size="small">确 定</el-button>
</span>
</el-dialog>
<!-- 重新加载当前分组列表 -->
<el-dialog
class="reload-label-modal"
:visible.sync="showReloadLabelModal"
width="320px"
:show-close="false"
:close-on-click-modal="false"
center>
<p class="tips">您刚才跳转到分组管理页面进行新建分组，请点击下方按钮刷新数据</p>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleReloadLabel">重新加载</el-button>
</span>
</el-dialog>
<!-- 下载二维码 弹窗 -->
<el-dialog
class="download-qr-modal"
title="下载二维码"
:visible.sync="showDownloadQRModal"
width="500px"
:show-close="false"
:close-on-click-modal="false"
center>
<div class="qr-pic"></div>
<p class="exp-date">有效期：2019.5.1-2019.5.30</p>
<div class="choose-group">
<p class="title">分组：</p>
<el-select v-model="currentQRDownloadGroup" placeholder="选择分组">
<el-option
v-for="item in qrDownloadGroups"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
<p class="under-tips">选择分组后，会自动生成相应的分组二维码，居民扫码后直接进入该分组</p>
<p class="under-tips">（若未选择分组，则自动生成未分组二维码，居民扫码后进入默认未分组）</p>
<span slot="footer" class="dialog-footer">
<el-button @click="showDownloadQRModal = false">取 消</el-button>
<el-button type="primary" @click="handleGoToDownloadQR">确定下载</el-button>
</span>
</el-dialog>
</el-tab-pane>
<el-tab-pane label="批量导入" name="third">
<div class="step-guide">
......@@ -184,10 +254,13 @@
import BreadCrumb from "@/components/breadcrumb.vue";
import * as commonUtil from "@/utils/utils";
import {
getUploadHistory
getQRCode,
getUploadHistory,
getLabelList,
refreshCode,
} from "@/utils/patients/patientsapi";
import { getSaasDomain } from '@/utils/index';
import { getSaasDomain } from '@/utils/index';
import QRCode from 'qrcode';
export default {
data() {
......@@ -207,14 +280,47 @@ import { getSaasDomain } from '@/utils/index';
token: localStorage.getItem('token')
},
files: [],
showChooseLabelModal: false,
showReloadLabelModal: false,
showDownloadQRModal: false,
currentQRDownloadGroup: '',
qrCodeInfo: {
qrcodeUrl: '',
beginTime: '',
endTime: '',
id: '',
labelIds: '',
},
currentLabelList: [],
labelNameList: [],
choosedLabelList: [],
qrDownloadGroups: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}]
}
},
components: {
BreadCrumb,
},
created() {
this.goToGetQRCode({
labelIds: '',
id: '',
first: true,
});
this.goToGetUploadHistory();
},
// 挂载到Dom完成时
......@@ -222,6 +328,100 @@ import { getSaasDomain } from '@/utils/index';
// commonUtil.resizeHeight();
},
methods: {
// 二维码录入
goToGetQRCode(params){
getQRCode(params).then(res => {
if(res.code == '000000'){
let data = res.data;
this.qrCodeInfo = data;
if(data.labelIds != ''){
this.currentLabelList = data.labelIds.split(',');
}
this.calculateQRCode(data.qrcodeUrl);
}else{
this.$message({
message: '获取二维码失败，请重新再试',
type: 'warning'
});
}
})
},
calculateQRCode(val){
// 获取页面的canvas
var msg= document.getElementById('msg')
// 将获取到的数据（val）画到msg（canvas）上
QRCode.toCanvas(msg, val, function (error) {
console.log(error)
})
},
handleChooseGroup() {
this.showChooseLabelModal = true;
this.goToGetGroupList();
},
handleRefreshCode() {
let params = {
labelIds: this.qrCodeInfo.labelIds,
id: this.qrCodeInfo.id,
first: false,
}
refreshCode(params).then(res => {
if(res.code == '000000'){
let data = res.data;
this.qrCodeInfo = data;
if(data.labelIds != ''){
this.currentLabelList = data.labelIds.split(',');
}
}else{
this.$message({
message: '获取二维码失败，请重新再试',
type: 'warning'
});
}
})
},
handleQRDownloadModal() {
this.showDownloadQRModal = true;
},
handleGoToDownloadQR() {
alert('待接口OK')
},
handleAfterChooseLabel() {
if(this.choosedLabelList.length < 1){
this.$message({
message: '请选择分组',
type: 'warning'
});
return;
}
this.showChooseLabelModal = false;
this.goToGetQRCode({
labelIds: this.choosedLabelList.join(','),
id: '',
first: false,
});
this.choosedLabelList = [];
},
handleClearSelect() {
this.choosedLabelList = [];
},
goToGetGroupList() {
// 获取分组列表
let params = {
type: 1,
};
if(this.labelName){
params.labelName = this.labelName;
}
getLabelList(params).then(data => {
// console.log('获取分组列表>> ', data)
if(data.data && data.data.labelNameList){
this.labelNameList = data.data.labelNameList;
}
}).catch(err => {
console.log('error: ', err)
});
},
goToGetUploadHistory(){
console.log('go get upload history>>>>>>')
let params = {
......@@ -256,7 +456,7 @@ import { getSaasDomain } from '@/utils/index';
this.goToGetUploadHistory();
},
handleDownloadDemo(){
window.open('https://file.yunqueyi.com/File/template/居民导入模板.xlsx');
window.location.href = 'https://file.yunqueyi.com/File/template/居民导入模板.xlsx';
},
changeFile(file, fileList) {
const name = file.name;
......@@ -300,6 +500,17 @@ import { getSaasDomain } from '@/utils/index';
this.error = response.message;
}
},
handleGoToLabelManage(){
let routeUrl = this.$router.resolve({
path: '/patients-manage/labels-manage/labels-list',
});
window.open(routeUrl.href, '_blank');
this.showReloadLabelModal = true;
},
handleReloadLabel() {
this.showReloadLabelModal = false;
this.goToGetGroupList();
}
}
}
......@@ -307,6 +518,7 @@ import { getSaasDomain } from '@/utils/index';
<style lang="less" scoped>
.newly-increased-wrap{
.screenSet{
background: #fff;
padding: 30px;
......@@ -338,6 +550,10 @@ import { getSaasDomain } from '@/utils/index';
<style lang="less">
.newly-increased-wrap{
#msg{
width:200px !important;
height:200px !important;
}
.top-title{
border: 0 !important;
}
......@@ -357,6 +573,93 @@ import { getSaasDomain } from '@/utils/index';
flex: 1;
display: flex;
flex-direction: column;
.choose-label-wrap{
.el-dialog__body{
padding: 0 25px 30px;
}
.under-title-tips{
font-size: 12px;
color: #595959;
text-align: center;
}
.row-in-line{
overflow: hidden;
margin-top: 35px;
.el-button, .tips{
display: inline-block;
}
.clear-select{
color: #449284;
border: 1px solid #449284;
&.is-disabled{
color: #c0c4cc !important;
background: #fff !important;
border: 1px solid #dcdfe6 !important;
opacity: 1;
}
}
.tips, .right{
float: right;
}
.tips{
line-height: 32px;
}
}
.list-wrap{
width: 100%;
height: 300px;
border: 1px solid #E4E7ED;
margin-top: 10px;
padding: 10px;
border-radius: 4px;
.el-checkbox{
margin-right: 10px;
margin-left: 0;
margin-bottom: 10px;
}
}
}
.reload-label-modal{
text-align: center;
.el-dialog__body{
padding: 0 25px 8px;
.tips{
text-align: center;
}
}
}
.download-qr-modal{
.qr-pic{
width: 200px;
height: 200px;
background: pink;
margin: 0 auto;
}
.exp-date{
line-height: 36px;
text-align: center;
color: #606060;
padding-bottom: 10px;
}
.choose-group{
text-align: center;
padding-bottom: 10px;
.title{
display: inline-block;
}
.el-select{
width: 350px;
}
}
.under-tips{
color: #a3a5aa;
font-size: 12px;
line-height: 20px;
text-align: center;
}
}
.el-tabs__item{
color: #303133;
font-weight: 600;
......@@ -531,6 +834,13 @@ import { getSaasDomain } from '@/utils/index';
background:rgba(240,242,245,1);
width: 200px; height: auto;
border: 0;
.qr-code-img{
width: 200px;
height: 200px;
overflow: hidden;
border: 0;
display: block;
}
.qr-download-btn{
color: #fff;
background: #449284;
......@@ -560,12 +870,20 @@ import { getSaasDomain } from '@/utils/index';
margin-top: 30px;
}
.increased-steps-wrap{
overflow: hidden;
.label-title{
font-size: 20px;
color: #1E2F3D;
line-height: 28px;
margin: 30px 0 24px;
}
.flow-path{
// width: 100%;
height: 441px;
display: block;
border: 0;
margin-left: -20px;
}
}
}
}
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或