Commit 60c14dac authored by gengchunlei's avatar gengchunlei

慢综 医生端 图片预览实现

parent 7dd76a03
......@@ -52,7 +52,7 @@ export default {
if (!token) {
token = sessionStorage.getItem('token')
if (process.env.NODE_ENV !== 'production') {
token = '83cc8934-c543-45cd-a3fd-364cf6f9739d'
token = '812fd32f-f78d-4b49-aaed-ce16f0c80544'
}
}
if (token) {
......
......@@ -3,7 +3,7 @@
<van-form ref='form'>
<div class='title'>随访信息</div>
<van-cell-group inset>
<div v-if="showOne && firstForm.visitSituation == 1">
<div v-if='showOne && firstForm.visitSituation == 1'>
<div class='no-req-label'>随访内容</div>
<van-field
v-model='form.visitContent'
......@@ -14,7 +14,7 @@
type='textarea'
/>
</div>
<div v-if="showOne && firstForm.visitSituation == 1">
<div v-if='showOne && firstForm.visitSituation == 1'>
<div class='no-req-label mt-5'>处置意见</div>
<van-field
v-model='form.idCard'
......@@ -42,13 +42,14 @@
</div>
</div>
<div v-if="showOne && firstForm.visitSituation == 1">
<div v-if='showOne && firstForm.visitSituation == 1'>
<div class='no-req-label mt-5'>上传随访记录</div>
<div class='tips'>
支持上传jpg、png、jpeg文件,大小请在10M以内
</div>
<div class='img-btn mt-2' @click="toUpload('imgId')">
<input type='file' id='imgId' multiple @change='choiceImg' style='display: none' :key='new Date().getTime()'>
<input type='file' id='imgId' multiple @change='choiceImg' style='display: none'
:key='new Date().getTime()'>
<div class='flex items-center justify-center'>
<div>
<doc-icon type='doc-upload' class='doc-up' />
......@@ -65,7 +66,7 @@
<doc-icon type='doc-remove' class='remove' @click='delImg(item.indexF)'></doc-icon>
</div>
<img :src='item.trueDownloadUrl' class='ml-2' style='width: 95px;height: 95px;'
@click='toPreview(index)'>
@click='toPreview(imgList,index)'>
</div>
</div>
</div>
......@@ -90,13 +91,14 @@
</div>
</div>
<div v-if="showOne && firstForm.visitSituation == 1">
<div v-if='showOne && firstForm.visitSituation == 1'>
<div class='no-req-label mt-5'>现场随访照片</div>
<div class='tips'>
支持上传jpg、png、jpeg文件,大小请在10M以内
</div>
<div class='img-btn mt-2' @click="toUpload('imgId2')">
<input type='file' id='imgId2' multiple @change='choiceImg2' style='display: none' :key='new Date().getTime()-10000'>
<input type='file' id='imgId2' multiple @change='choiceImg2' style='display: none'
:key='new Date().getTime()-10000'>
<div class='flex items-center justify-center'>
<div>
<doc-icon type='doc-upload' class='doc-up' />
......@@ -113,7 +115,7 @@
<doc-icon type='doc-remove' class='remove' @click='delImg2(item.indexF)'></doc-icon>
</div>
<img :src='item.trueDownloadUrl' class='ml-2' style='width: 95px;height: 95px;'
@click='toPreview(index)'>
@click='toPreview(imgList2 ,index)'>
</div>
</div>
</div>
......@@ -138,7 +140,18 @@
</div>
</div>
<div v-if="firstForm.visitSituation == 1">
<!-- 图片预览-->
<van-overlay :show='imgShow' @click='imgShow = false'>
<div class='wrapper'>
<van-swipe class='block' :initial-swipe='initSwipe'>
<van-swipe-item v-for='image in showImgList' :key='image'>
<img :src='image' style='width: 100%;height: 100%'/>
</van-swipe-item>
</van-swipe>
</div>
</van-overlay>
<div v-if='firstForm.visitSituation == 1'>
<div class='label-title mt-5'>下次随访日期</div>
<van-field
v-model='form.nextVisitDate'
......@@ -146,11 +159,11 @@
disabled
placeholder='下次随访日期'
class='input-back mt-2 form-input'
@click="showDate = true"
@click='showDate = true'
:rules='rules.nextVisitDate'
/>
<van-popup v-model:show="showDate" position="bottom">
<van-date-picker @confirm="dataConfirm" @cancel="showDate = false" />
<van-popup v-model:show='showDate' position='bottom'>
<van-date-picker @confirm='dataConfirm' @cancel='showDate = false' />
</van-popup>
</div>
</van-cell-group>
......@@ -178,7 +191,7 @@ export default {
default: () => {
return {}
}
},
}
},
data() {
return {
......@@ -191,8 +204,11 @@ export default {
imgInputList1: [],
imgInputList2: [],
showDate: false,
imgShow: false,
showImgList: [],
initSwipe: 0,
rules: {
nextVisitDate: [{required: true,message: '请选择'}]
nextVisitDate: [{ required: true, message: '请选择' }]
}
}
},
......@@ -206,12 +222,12 @@ export default {
}
},
immediate: true
},
}
},
computed: {
//复检指导
showOne() {
const {visitWay} = this.firstForm
const { visitWay } = this.firstForm
let res = false
if (visitWay == 5 || visitWay == 6 || visitWay == 7 || visitWay == 8) {
res = true
......@@ -220,7 +236,7 @@ export default {
},
//微信、短信指导
showTwo() {
const {visitWay} = this.firstForm
const { visitWay } = this.firstForm
let res = false
if (visitWay == 9 || visitWay == 11) {
res = true
......@@ -229,7 +245,7 @@ export default {
},
//催检
showThree() {
const {visitWay} = this.firstForm
const { visitWay } = this.firstForm
let res = false
if (visitWay == 10 || visitWay == 12) {
res = true
......@@ -237,7 +253,7 @@ export default {
return res
},
imgListInfo1() {
const {uploadVisitRecordImageList = []} = this.info
const { uploadVisitRecordImageList = [] } = this.info
uploadVisitRecordImageList.forEach((item, index) => {
item['imgFlag'] = ''
item['indexF'] = index + 1
......@@ -251,7 +267,7 @@ export default {
return uploadVisitRecordImageList
},
imgListInfo2() {
const {sceneVisitImageList = []} = this.info
const { sceneVisitImageList = [] } = this.info
sceneVisitImageList.forEach((item, index) => {
item['imgFlag'] = ''
item['indexF'] = index + 1
......@@ -263,7 +279,7 @@ export default {
}
})
return sceneVisitImageList
},
}
},
methods: {
setForm(info = {}) {
......@@ -321,9 +337,9 @@ export default {
let input = document.getElementById('imgId')
let file = input.files
let newFile = Array.from(file)
let maxIndexF = Math.max(...this.imgList.map(item => item.indexF));
let maxIndexF = Math.max(...this.imgList.map(item => item.indexF))
newFile.forEach((item, index) => {
item['indexF'] = maxIndexF+ index + 1
item['indexF'] = maxIndexF + index + 1
item['trueDownloadUrl'] = window.URL.createObjectURL(item)
item['imgFlag'] = ''
if (item.type == 'application/pdf') {
......@@ -340,9 +356,9 @@ export default {
let input = document.getElementById('imgId2')
let file = input.files
let newFile = Array.from(file)
let maxIndexF = Math.max(...this.imgList2.map(item => item.indexF));
let maxIndexF = Math.max(...this.imgList2.map(item => item.indexF))
newFile.forEach((item, index) => {
item['indexF'] = maxIndexF+ index + 1
item['indexF'] = maxIndexF + index + 1
item['trueDownloadUrl'] = window.URL.createObjectURL(item)
item['imgFlag'] = ''
if (item.type == 'application/pdf') {
......@@ -357,17 +373,15 @@ export default {
this.imgInputList2 = this.imgInputList2.concat(newFile)
},
//图片预览
toPreview(index) {
// let list = []
// this.imgList.forEach(item => {
// list.push(item.trueDownloadUrl)
// })
// showImagePreview({
// images: list,
// className: 'custom-image-preview',
// startPosition: index,
// loop: false
// })
toPreview(list = [], index) {
let res = []
this.showImgList = []
list.forEach(item => {
res.push(item.trueDownloadUrl)
})
this.showImgList = res
this.initSwipe = index
this.imgShow = true
},
//pdf预览
toPdf(item) {
......@@ -506,7 +520,16 @@ export default {
top: -9px;
z-index: 1;
}
.wrapper {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
.block {
width: 100%;
height: 300px;
}
}
:deep(.van-cell-group--inset) {
overflow: visible;
......@@ -537,9 +560,10 @@ export default {
}
.van-swipe__track {
width: 100%!important;
width: 100% !important;
}
.van-swipe-item {
width: 100%!important;
width: 100% !important;
}
</style>
\ No newline at end of file
......@@ -30,11 +30,11 @@ module.exports = defineConfig({
}
},
'/chronic-admin': {
// target: 'https://beta-tumour.zmnyjk.com',
target: 'http://192.168.1.43:8900',
target: 'https://beta-tumour.zmnyjk.com',
// target: 'http://192.168.1.43:8900',
changOrigin: true,
pathRewrite: {
'^/chronic-admin': '/'
'^/chronic-admin': '/chronic-admin'
}
},
'/chronic-resident': {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment