6 changed files with 282 additions and 11 deletions
@ -0,0 +1,248 @@ |
|||
<template> |
|||
<div class="talk" style="margin-top:8px"> |
|||
<div class="bg-white list-box"> |
|||
<div class="list-item"> |
|||
<div>谈话开始时间</div> |
|||
<div @click="openTimeSelect('talkStart', '谈话开始时间')" class="flex items-center"> |
|||
<span class="mr-3" v-if="talkStart"> |
|||
{{ $moment(+talkStart).format('YYYY-MM-DD HH:mm') }} |
|||
</span> |
|||
<span class="mr-3 gray-text" v-else>请选择时间</span> |
|||
<u-icon name="clock" color="#2979ff" size="28"></u-icon> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<u-collapse |
|||
:head-style="headerStyle" |
|||
:item-style="itemStyle" |
|||
class="w-full" |
|||
style="margin-top:8px" |
|||
:bordered="false" |
|||
expand-icon-position="right" |
|||
> |
|||
<!-- <template #expandIcon="props"> |
|||
<u-icon type="down" :rotate="props.isActive ? 0 : -180" /> |
|||
</template> --> |
|||
<u-collapse-item :open="false" class="w-full" title="谈话辅助工具" :style="customStyle"> |
|||
<!-- <video class="thr m-auto fill-width" src="https://www.tall.wiki/staticrec/photos/001.mp4"></video> --> |
|||
<!-- <video id="video" src="https://www.tall.wiki/gateway/qcp/v3.0/uploads/1.mp4" contr |
|||
ols="controls" class="fill-width"></video> --> |
|||
<img |
|||
style="height: 400px;width: 100%" |
|||
src="https://www.tall.wiki/staticrec/img/fuzhu.png" |
|||
alt="" |
|||
/> |
|||
</u-collapse-item> |
|||
</u-collapse> |
|||
<div class="bg-white list-box"> |
|||
<div class="list-item"> |
|||
<div>签署知情同意书</div> |
|||
<div @click="openTimeSelect('ZQTH-SJ', '签署知情同意书')" class="flex items-center"> |
|||
<span class="mr-3" v-if="ZQTHSJ"> |
|||
{{ $moment(+ZQTHSJ).format('YYYY-MM-DD HH:mm') }} |
|||
</span> |
|||
<span class="mr-3 gray-text" v-else>请选择时间</span> |
|||
<u-icon name="clock" color="#2979ff" size="28"></u-icon> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<u-collapse |
|||
:head-style="headerStyle" |
|||
:item-style="itemStyle" |
|||
class="w-full" |
|||
style="margin-top:8px" |
|||
:bordered="false" |
|||
expand-icon-position="right" |
|||
> |
|||
<u-collapse-item :open="false" class="w-full" title="知情同意书存档" :style="customStyle"> |
|||
<u-upload |
|||
name="files" |
|||
:header="header" |
|||
ref="uUpload" |
|||
accept="image/*" |
|||
:action="action" |
|||
:file-list="fileList" |
|||
@on-success="successUpload" |
|||
@on-remove="removePic" |
|||
> |
|||
</u-upload> |
|||
</u-collapse-item> |
|||
</u-collapse> |
|||
<u-picker mode="time" v-model="show" :title="title" :params="timeSelectparams" @confirm="chooseTime"></u-picker> |
|||
<u-toast ref="uToast" /> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
import { mapState } from 'vuex'; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
action: '', |
|||
fileList: [], |
|||
timeValue: 0, |
|||
title: '', |
|||
timeCode: '', |
|||
talkStart: null, |
|||
ZQTHSJ: null, |
|||
CTendTime: null, |
|||
show: false, |
|||
timeSelectparams: { |
|||
// 时间选择器可以选择那个时间 |
|||
year: true, |
|||
month: true, |
|||
day: true, |
|||
hour: true, |
|||
minute: true, |
|||
second: false, |
|||
}, |
|||
customStyle: 'background: #fff;border-radius: 4px;border: 0;overflow: hidden;height:300px;', |
|||
headerStyle: { |
|||
height: '54px', |
|||
lineHeight: '30px', |
|||
fontSize: '14px', |
|||
padding: '0 16px', |
|||
/* color: #1890ff; */ |
|||
color: 'rgba(0, 0, 0, 0.65)', |
|||
backgroundColor: '#fff', |
|||
}, |
|||
itemStyle: { marginBottom: '8px' }, |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapState('carbasics', ['firstAidId']), |
|||
...mapState('user', ['token']), |
|||
header() { |
|||
return { |
|||
Authorization: 'Bearer ' + this.token, |
|||
'Content-Type': 'multipart/form-data', |
|||
} |
|||
} |
|||
}, |
|||
created() { |
|||
this.action = uni.$u.api.uploadFile; |
|||
this.getDefault() |
|||
}, |
|||
methods: { |
|||
// 上传图片成功时 |
|||
successUpload() { |
|||
const lists = this.$refs.uUpload.lists; |
|||
let fileList = []; |
|||
for(let i=0;i<lists.length;i++) { |
|||
const obj = { |
|||
url: lists[i].url |
|||
} |
|||
fileList.push(obj) |
|||
} |
|||
this.changePic(fileList); |
|||
}, |
|||
// 删除图片 |
|||
removePic() { |
|||
let lists = this.$refs.uUpload.lists; |
|||
let fileList = []; |
|||
for(let i=0;i<lists.length;i++) { |
|||
const obj = { |
|||
url: lists[i].url |
|||
} |
|||
fileList.push(obj) |
|||
} |
|||
this.changePic(fileList); |
|||
}, |
|||
// 上传图片答案,需要将数组修改为json字符串格式 |
|||
changePic(list) { |
|||
const setParam = { |
|||
codeAndAnswerList: [ |
|||
{ |
|||
questionCode: 'ZQTH-QZ', |
|||
answer: [JSON.stringify(list)], |
|||
}, |
|||
], |
|||
firstAidId:this.firstAidId, |
|||
}; |
|||
uni.$u.api.setRecord(setParam); |
|||
}, |
|||
// 获取默认选中的时间/上传的图片并赋值 |
|||
async getDefault() { |
|||
const codeList = ['talkStart', 'ZQTH-SJ', 'ZQTH-QZ', 'YJJL-CTendTime']; |
|||
const param = { |
|||
codeList, |
|||
firstAidId: this.firstAidId, |
|||
}; |
|||
const data = await this.$u.api.getRecord(param); |
|||
this.talkStart = data.record['talkStart'] && data.record['talkStart'].length ? data.record['talkStart'][0] : null; |
|||
this.ZQTHSJ = data.record['ZQTH-SJ'] && data.record['ZQTH-SJ'].length ? data.record['ZQTH-SJ'][0] : null; |
|||
this.CTendTime = data.record['YJJL-CTendTime'] && data.record['YJJL-CTendTime'].length ? data.record['YJJL-CTendTime'][0] : null; |
|||
this.fileList = data.record['ZQTH-QZ'] && data.record['ZQTH-QZ'].length ? JSON.parse(data.record['ZQTH-QZ'][0]) : []; |
|||
}, |
|||
// 打开时间选择器组件 |
|||
// 打开时间选择器 |
|||
openTimeSelect(code, title) { |
|||
this.timeValue = 0; |
|||
this.timeCode = code; |
|||
this.title = title; |
|||
this.show = true; |
|||
}, |
|||
// 选中时间 |
|||
chooseTime(time) { |
|||
const timeValue = this.$moment(`${time.year}-${time.month}-${time.day} ${time.hour}:${time.minute}:00`).valueOf(); |
|||
let codeAndAnswerList = null; |
|||
if (this.timeCode === 'talkStart') { |
|||
this.talkStart = timeValue; |
|||
codeAndAnswerList = [ |
|||
{ |
|||
questionCode: 'talkStart', |
|||
answer: [timeValue], |
|||
}, |
|||
]; |
|||
} else if (this.timeCode === 'ZQTH-SJ') { |
|||
if (this.CTendTime && timeValue < this.CTendTime - 0) { |
|||
this.$refs.uToast.show({ |
|||
title: '签署知情同意书时间不能早于CT完成时间,请重新选择', |
|||
type: 'warning', |
|||
}); |
|||
return; |
|||
} else { |
|||
this.ZQTHSJ = timeValue; |
|||
codeAndAnswerList = [ |
|||
{ |
|||
questionCode: 'ZQTH-SJ', |
|||
answer: [timeValue], |
|||
}, |
|||
]; |
|||
} |
|||
} |
|||
const setParam = { |
|||
codeAndAnswerList, |
|||
firstAidId:this.firstAidId, |
|||
}; |
|||
uni.$u.api.setRecord(setParam); |
|||
}, |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.list-box { |
|||
border-radius: 4px; |
|||
overflow: hidden; |
|||
box-sizing: border-box; |
|||
margin: 0; |
|||
padding: 0; |
|||
color: rgba(0, 0, 0, 0.65); |
|||
font-size: 14px; |
|||
font-variant: tabular-nums; |
|||
line-height: 1.5; |
|||
list-style: none; |
|||
font-feature-settings: 'tnum'; |
|||
position: relative; |
|||
} |
|||
.list-item { |
|||
min-height: 54px; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
padding: 12px 16px; |
|||
border-bottom: 1px solid #e8e8e8; |
|||
margin-top: 8px; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue