Skip to content

F
frontend-h5
Commit ec26d6dc authored by songrui's avatar songrui
Browse files
Options

宣教详情修改

parent c3eb14bb
Hide whitespace changes
Inline Side-by-side
Showing with 57 additions and 59 deletions
src/residentWX/components/mediaPlay/Mp3.vue
View file @ ec26d6dc
<template> <template>
<div class="p-1 flex flex-col mp3"> <div class="p-1 flex flex-col mp3">
<div v-for="item in files" :key="item.annexId"> <div v-if="file.annexFileName" class="text-12 mb-1 text-ellipsis">{{ file.annexFileName }}</div>
<div v-if="item.annexFileName" class="text-12 mb-1 text-ellipsis">{{ item.annexFileName }}</div> <div class="flex items-center justify-between gap-x-2.5">
<div class="flex items-center justify-between gap-x-2.5"> <div class="shrink-0 play-bt" @click="start(file)">
<div class="shrink-0 play-bt" @click="start(item)"> <doc-icon type="doc-play" />
<doc-icon type="doc-play" />
</div>
<span class="shrink-0 time">{{timeFormat(player.duration)}}</span>
<div class="grow progress">
<van-slider v-model="player.currentTime" :max="sliderMax" :bar-height="6" :button-size="0"
@change="onProgress" />
<!-- <div :style="`width: ${progress}%`"></div> -->
</div>
<span class="shrink-0 time" :style="`opacity: ${player.currentTime ? 1 : 0}`">
{{ timeFormat(player.currentTime) }}</span>
</div> </div>
<span class="shrink-0 time">{{timeFormat(player.duration)}}</span>
<div class="grow progress">
<van-slider v-model="player.currentTime" :max="sliderMax" :bar-height="6" :button-size="0"
@change="onProgress" />
<!-- <div :style="`width: ${progress}%`"></div> -->
</div>
<span class="shrink-0 time" :style="`opacity: ${player.currentTime ? 1 : 0}`">
{{ timeFormat(player.currentTime) }}</span>
</div> </div>
<audio ref="audio" type="audio/mpeg" crossOrigin="anonymous" style="display: none"></audio> <audio ref="audio" type="audio/mpeg" crossOrigin="anonymous" style="display: none"></audio>
</div> </div>
...@@ -26,7 +24,7 @@ import { showToast } from 'vant' ...@@ -26,7 +24,7 @@ import { showToast } from 'vant'
export default { export default {
props: { props: {
files: { default: () => [] } file: { default: () => ({}) }
}, },
data() { data() {
return { return {
......
src/residentWX/components/mediaPlay/Mp4.vue
View file @ ec26d6dc
...@@ -7,10 +7,11 @@ ...@@ -7,10 +7,11 @@
<doc-icon type="doc-play" /> <doc-icon type="doc-play" />
</div> </div>
</div> </div>
<div v-if="item.annexFileName" class="text-12 mb-1 text-ellipsis">{{ item.annexFileName }}</div> <div v-if="item.annexFileName" class="text-12 my-1 text-ellipsis">{{ item.annexFileName }}</div>
</div> </div>
</div> </div>
<van-popup v-model:show="visible" :close-on-click-overlay="false" closeable> <van-popup v-model:show="visible" :close-on-click-overlay="false" closeable
close-icon-position="top-right">
<video controls width="100%" v-if="visible"> <video controls width="100%" v-if="visible">
<source :src="activeVideo.annexUrl" type="video/mp4" /> <source :src="activeVideo.annexUrl" type="video/mp4" />
播放失败! 播放失败!
...@@ -45,6 +46,7 @@ export default { ...@@ -45,6 +46,7 @@ export default {
width: calc(50% - 5px); width: calc(50% - 5px);
.item { .item {
background: url('@/assets/image/residentWX/video-default.png') no-repeat; background: url('@/assets/image/residentWX/video-default.png') no-repeat;
background-size: 100%;
height: .84rem; height: .84rem;
display: flex; display: flex;
align-items: center; align-items: center;
......
src/residentWX/guide/Detail.vue
View file @ ec26d6dc
...@@ -8,22 +8,18 @@ ...@@ -8,22 +8,18 @@
</div> </div>
<div class="px-4 py-3 flex shrink-0 base-info"> <div class="px-4 py-3 flex shrink-0 base-info">
<div class="flex w-full"> <div class="flex w-full flex-wrap">
<img src="@/assets/image/residentWX/avatar.png" alt="" class="shrink-0" <div class="item">
style="width: .56rem"> <span>指导单位：</span>
<div class="grow flex flex-col pl-3"> <span>{{ info.visitUnitName || '-' }}</span>
<div class="item"> </div>
<span>指导单位：</span> <div class="item">
<span>{{ info.visitUnitName || '-' }}</span> <span>指导科室：</span>
</div> <span>{{ info.visitOfficeName || '-' }}</span>
<div class="item"> </div>
<span>指导科室：</span> <div class="item">
<span>{{ info.visitOfficeName || '-' }}</span> <span>指导日期：</span>
</div> <span>{{ info.visitDate || '-' }}</span>
<div class="item">
<span>指导日期：</span>
<span>{{ info.visitDate || '-' }}</span>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -31,41 +27,42 @@ ...@@ -31,41 +27,42 @@
<div class="p-3 h-full cont-inner"> <div class="p-3 h-full cont-inner">
<div class="flex justify-between collapse-head"> <div class="flex justify-between collapse-head">
<span class="text-16">全部内容</span> <span class="text-16">全部内容</span>
<span @click="toggleAll"> <!-- <span @click="toggleAll">
<span v-if="!collapseAll">展开全部</span> <span v-if="!collapseAll">展开全部</span>
<span v-else>展开收起</span> <span v-else>展开收起</span>
<span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]"> <span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]">
<doc-icon type="doc-down" /> <doc-icon type="doc-down" />
</span> </span>
</span> </span> -->
</div>
<div>
<div class="my-2" style="color: #262626">指导内容</div>
<div v-if="contentList.length" class="flex flex-col card">
<!-- 文本 -->
<div v-for="item in contentList" :key="item.templateMode" class="mb-1 flex"
:style="`order: ${item.templateMode}`">
<span class="shrink-0 mr-1" v-if="item.templateModeTrans != '无'">{{ item.templateModeTrans }} :</span>
<span style="white-space: pre-wrap;">{{item.templateContent}}</span>
</div>
</div>
<div v-if="mp4List.length" class="card mt-2">
<Mp4 :files="mp4List"/>
</div>
<div v-if="mp3List.length" class="card flex flex-col mt-2" style="row-gap: .06rem;">
<Mp3 :file="item" v-for="item in mp3List" :key="item.annexId"/>
</div>
</div> </div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse" <!-- <van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse"
@change="collapseChange"> @change="collapseChange">
<van-collapse-item v-for="collapse in collapseList" :key="collapse.name" <van-collapse-item v-for="collapse in collapseList" :key="collapse.name"
:title="collapse.title" :name="collapse.name"> :title="collapse.title" :name="collapse.name">
<template #right-icon> <template #right-icon>
<doc-icon type="doc-down" /> <doc-icon type="doc-down" />
</template> </template>
<div>
<!-- <div style="color: #262626">指导内容</div> -->
<div v-if="contentList.length" class="flex flex-col card">
<!-- 文本 -->
<div v-for="item in contentList" :key="item.templateMode" class="mb-1 flex"
:style="`order: ${item.templateMode}`">
<span class="shrink-0 mr-1" v-if="item.templateModeTrans != '无'">{{ item.templateModeTrans }} :</span>
<span style="white-space: pre-wrap;">{{item.templateContent}}</span>
</div>
</div>
<div v-if="mp4List.length" class="card mt-2">
<Mp4 :files="mp4List"/>
</div>
<div v-if="mp3List.length" class="card mt-2">
<Mp3 :files="mp3List"/>
</div>
</div>
</van-collapse-item> </van-collapse-item>
</van-collapse> </van-collapse> -->
</div> </div>
</div> </div>
</div> </div>
...@@ -161,7 +158,8 @@ export default { ...@@ -161,7 +158,8 @@ export default {
.base-info { .base-info {
background: linear-gradient(to bottom, #DFF5F4 , #fff 50%); background: linear-gradient(to bottom, #DFF5F4 , #fff 50%);
>div { >div {
align-items: flex-start; column-gap: 16px;
row-gap: 8px;
} }
.item { .item {
margin-bottom: 2px; margin-bottom: 2px;
......
src/residentWX/guide/List.vue
View file @ ec26d6dc
...@@ -35,8 +35,8 @@ ...@@ -35,8 +35,8 @@
<span class="label">筛查科室</span> <span class="label">筛查科室</span>
<span>{{ item.visitOfficeName }}</span> <span>{{ item.visitOfficeName }}</span>
</div> </div>
<span class="tag tag-orange" v-show="item.visitWayRules == '2'">健康指导</span> <span class="tag tag-orange" v-show="item.visitWayRules.includes('2')">健康指导</span>
<span class="tag tag-green" v-show="item.visitWayRules == '3'">健康宣教</span> <span class="tag tag-green" v-show="item.visitWayRules.includes('3')">健康宣教</span>
</div> </div>
</div> </div>
</van-list> </van-list>
......
src/residentWX/visit/detail/GeneralFUDetail.vue
View file @ ec26d6dc
...@@ -177,8 +177,8 @@ ...@@ -177,8 +177,8 @@
<div v-if="mp4List.length" class="card mt-2"> <div v-if="mp4List.length" class="card mt-2">
<Mp4 :files="mp4List"/> <Mp4 :files="mp4List"/>
</div> </div>
<div v-if="mp3List.length" class="card mt-2"> <div v-if="mp3List.length" class="card flex flex-col mt-2" style="row-gap: .06rem;">
<Mp3 :files="mp3List"/> <Mp3 :file="item" v-for="item in mp3List" :key="item.annexId"/>
</div> </div>
</div> </div>
</van-collapse-item> </van-collapse-item>
......
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