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