151 lines
3.2 KiB
Vue
151 lines
3.2 KiB
Vue
<template>
|
||
<!-- Mobile 来源: ykt-management-mobile/src/pages/manage-plan/plan-list/plan-list.vue（wxapp mock：仅选择模板并回到 new-followup） -->
|
||
<view class="page">
|
||
<view v-if="list.length === 0" class="empty">
|
||
<image class="empty-img" src="/static/empty.svg" mode="aspectFit" />
|
||
<view class="empty-text">暂无回访计划</view>
|
||
</view>
|
||
|
||
<scroll-view v-else scroll-y class="scroll">
|
||
<view v-for="(p, idx) in list" :key="p.id" class="item">
|
||
<view class="left">
|
||
<view class="name-row">
|
||
<view class="name">{{ p.planName }}</view>
|
||
<view v-if="p.planType === 'corp'" class="tag corp">机构</view>
|
||
<view class="tag outline" @click.stop="preview(p)">详情</view>
|
||
</view>
|
||
<view class="desc">应用范围：{{ p.planDetail }}</view>
|
||
</view>
|
||
<view class="btn" @click="select(p)">选择</view>
|
||
</view>
|
||
<view style="height: 24px;"></view>
|
||
</scroll-view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref } from 'vue';
|
||
import { onLoad } from '@dcloudio/uni-app';
|
||
|
||
const archiveId = ref('');
|
||
|
||
const list = ref([
|
||
{
|
||
id: 'p1',
|
||
planName: '复诊提醒模板',
|
||
planType: 'corp',
|
||
planDetail: '适用于复诊提醒人群',
|
||
eventType: 'revisit',
|
||
taskContent: '请于本周内完成复诊预约与提醒。',
|
||
},
|
||
{
|
||
id: 'p2',
|
||
planName: '随访回访模板',
|
||
planType: 'team',
|
||
planDetail: '适用于普通随访',
|
||
eventType: 'followup',
|
||
taskContent: '请电话回访患者，确认恢复情况并记录结果。',
|
||
},
|
||
]);
|
||
|
||
onLoad((options) => {
|
||
archiveId.value = options?.archiveId ? String(options.archiveId) : '';
|
||
});
|
||
|
||
function select(plan) {
|
||
uni.setStorageSync('select-mamagement-plan', plan);
|
||
uni.navigateTo({ url: `/pages/case/new-followup?archiveId=${encodeURIComponent(archiveId.value)}&fromPlan=1` });
|
||
}
|
||
|
||
function preview(plan) {
|
||
uni.showModal({
|
||
title: plan.planName || '回访计划',
|
||
content: plan.taskContent || plan.planDetail || '',
|
||
showCancel: false,
|
||
});
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.page {
|
||
height: 100vh;
|
||
background: #fff;
|
||
}
|
||
.scroll {
|
||
height: 100vh;
|
||
}
|
||
.item {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 12px 14px;
|
||
border-bottom: 1px solid #f2f2f2;
|
||
}
|
||
.left {
|
||
flex: 1;
|
||
min-width: 0;
|
||
margin-right: 10px;
|
||
}
|
||
.name-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
margin-bottom: 6px;
|
||
}
|
||
.name {
|
||
font-size: 14px;
|
||
font-weight: 600;
|
||
color: #333;
|
||
max-width: 220px;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
.tag {
|
||
font-size: 12px;
|
||
padding: 4px 8px;
|
||
border-radius: 6px;
|
||
}
|
||
.tag.corp {
|
||
background: #4f6ef7;
|
||
color: #fff;
|
||
}
|
||
.tag.outline {
|
||
border: 1px solid #4f6ef7;
|
||
color: #4f6ef7;
|
||
background: #fff;
|
||
}
|
||
.desc {
|
||
font-size: 12px;
|
||
color: #999;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
.btn {
|
||
flex-shrink: 0;
|
||
padding: 8px 12px;
|
||
border-radius: 999px;
|
||
border: 1px solid #4f6ef7;
|
||
color: #4f6ef7;
|
||
font-size: 13px;
|
||
}
|
||
.empty {
|
||
height: 100vh;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.empty-img {
|
||
width: 160px;
|
||
height: 160px;
|
||
opacity: 0.9;
|
||
}
|
||
.empty-text {
|
||
margin-top: 10px;
|
||
font-size: 13px;
|
||
color: #9aa0a6;
|
||
}
|
||
</style>
|
||
|