feat: 疗休养UI优化

2026-11-05 16:17:06 +08:00
parent 506121ac5f
commit 134a11da09
9 changed files with 353 additions and 76 deletions
@@ -333,12 +333,15 @@ public class TheRapyRecuperationUnionQueryController {
    public Object getLxsData(PageForm pageForm, String year, String agencyId) {
        Cnd cnd = Cnd.NEW();
        Sql sql = Sqls.create("""
+                SELECT agency.*
+                FROM (
                SELECT
-                	*,
+                    agency.*,
                	files AS fileId,
                	( SELECT COUNT( 1 ) FROM inclusive_therapy_v3_enroll WHERE agency.id = takePartInTravelAgencyId and isNormal=true and stateId=@stateId $unionCnd $yearCnd) agencyNum
                FROM
                	inclusive_therapy_v3_travel_agency agency
+                ) agency
                $condition
                """).setParam("stateId", TheRapyRecuperationState.PASS);
        if (!TherapyContext.hasAnyRoles("sysadmin,H06")) {
@@ -349,11 +352,9 @@ public class TheRapyRecuperationUnionQueryController {
        }
        cnd.andEX("agency.`year`", "=", year);
        cnd.andEX("agency.id", "=", agencyId);
+        cnd.and("agency.agencyNum", ">", 0);
        sql.setCondition(cnd);
        Pagination pagination = baseService.listPageMap(pageForm.getPageNumber(), pageForm.getPageSize(), sql);
-        List<NutMap> list = pagination.getList();
-        List<NutMap> agencyNum = list.stream().filter(v -> v.getInt("agencyNum") > 0).collect(Collectors.toList());
-        pagination.setList(agencyNum);
        return pagination;
    }

@@ -99,8 +99,16 @@ public class TheRapyRecuperationEnrollServiceImpl extends TherapyServiceImpl<The
    @Inject
    private TheRapyRecuperationLineService lineService;

+    private boolean isCurrentUserInActivityScope() {
+        TheRapyRecuperationConfig config = dao().fetch(TheRapyRecuperationConfig.class);
+        return config != null && activityBasicScopeService.isUserInGroup(config.getActivityGroupId(), TherapyContext.getUserId());
+    }
+
    @Override
    public Pagination enrollPageData(PageForm pageForm, Integer year, String unionId, int trrt, Integer lineUnionType, String lineKeyword, Integer signUpStatus) {
+        if (!isCurrentUserInActivityScope()) {
+            return new Pagination(pageForm.getPageNumber(), pageForm.getPageSize(), 0, Collections.emptyList());
+        }
        Cnd cnd = Cnd.NEW();
        if (List.of(TheRapyRecuperationType.provinceInLine.getValue(), TheRapyRecuperationType.provinceOutLine.getValue()).contains(trrt)) {
            Sql lineSql = Sqls.create("""
@@ -217,6 +225,9 @@ public class TheRapyRecuperationEnrollServiceImpl extends TherapyServiceImpl<The

    @Override
    public List<NutMap> getSelectLineById(String lineId, String usId, String unionId, int trrt, Integer lineUnionType, Integer signUpStatus) {
+        if (!isCurrentUserInActivityScope()) {
+            return Collections.emptyList();
+        }
        Sql lineSql = Sqls.create("""
                SELECT
                    us.id as usId,
@@ -23,6 +23,14 @@ const mobileMixins = {
        }
    },
    methods: {
+        historyBack(callback) {
+            if (window.history.length > 1) {
+                window.history.back()
+            } else {
+                window.location.href = '/platform/h5/home'
+            }
+            if (typeof callback === 'function') callback()
+        },
        async pageData() {
            this.mLoading = true
            if (this.pageDataUrl == null) {
@@ -115,6 +115,40 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
            padding-right: 0;
        }
    }
+    #app .branch-query-filters .query-route-choice {
+        display: flex;
+        align-items: center;
+        gap: 12px;
+    }
+
+    #app .branch-query-filters .query-route-choice > span {
+        flex-shrink: 0;
+    }
+
+    #app .branch-query-filters .query-route-choice > .el-select {
+        flex: 1;
+        min-width: 0;
+        width: 0 !important;
+    }
+
+    #app .branch-query-filters .query-route-hint {
+        padding-left: 20px;
+        color: #b36b13;
+        font-size: 13px;
+        line-height: 20px;
+    }
+
+    #app .branch-query-filters .query-route-hint > span {
+        color: inherit;
+        text-align: left;
+    }
+
+    @media (max-width: 767px) {
+        #app .branch-query-filters .query-route-choice,
+        #app .branch-query-filters .query-route-hint { width: 100%; }
+        #app .branch-query-filters .query-route-hint { padding: 10px 0 0; }
+    }
+
    .therapy-query-view-dialog,
    .therapy-query-edit-dialog {
        display: flex;
@@ -393,7 +427,7 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                    <el-col class="query-row-title"></el-col>
                    <el-col class="query-row-content">
                        <el-row>
-                            <el-col :span="12" v-if="pageForm.state=='1'">
+                            <el-col :span="12" v-if="pageForm.state=='1'" class="query-route-choice">
                                <span>选择路线：</span>
                                <el-select v-model="pageForm.takePartInLineId" filterable clearable
                                           placeholder="请选择线路"
@@ -406,6 +440,9 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                                </el-select>

                            </el-col>
+                            <el-col :span="12" v-if="pageForm.state=='1'" class="query-route-hint">
+                                <span>【本工会报名线路】和【本工会人员选择其他工会的线路】</span>
+                            </el-col>
                            <el-col :span="12" v-if="pageForm.state=='2'">
                                <span>选择旅行社：</span>
                                <el-select v-model="pageForm.agencyId" filterable clearable
@@ -436,11 +473,6 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                        </el-row>


-                        <el-row v-if="pageForm.state=='1'" class="query-hint-row">
-                            <el-col :span="24" class="query-hint">
-                                <span>【本工会报名线路】和【本工会人员选择其他工会的线路】</span>
-                            </el-col>
-                        </el-row>
                        <el-row v-if="!pageForm.state" class="query-hint-row">
                            <el-col :span="24" class="query-hint">
                                <span>温馨提醒:当前操作查询是【本工会当年参加疗休养的人员（包含校工会线路）】和【其他工会选择本工会线路的疗休养人员】</span>
@@ -499,7 +531,7 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){


            <el-card shadow="never" class="mt10">
-                <table-tool label="" :app="this" ref="table_tool">
+                <therapy-table-tool label="" :app="this" ref="table_tool">
                    <template #label_end>
                        <el-radio-group size="small" v-model="pageForm.lb" class="ml10"
                                        @change="doSearch()"
@@ -576,9 +608,9 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                            <el-radio-button label="省外">省外</el-radio-button>
                        </el-radio-group>
                    </template>
-                </table-tool>
+                </therapy-table-tool>

-                <el-table :data="tableData" style="width: 100%"
+                <el-table :key="pageForm.state + '-' + pageForm.lb" :data="tableData" style="width: 100%"
                          ref="table"
                          @selection-change="handleSelectionChange"
                          row-key="id" @sort-change="pageOrder1"
@@ -821,10 +853,12 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                            :sortable="column.sortable"
                     :key="column.id || column.code || therapyIndex">

-                        <template slot-scope="{row}" v-if="column.prop=='isFamily'">
+                        <template slot-scope="{row}">
+                        <template v-if="column.prop=='isFamily'">
                            {{row.isFamily?'携带':'未携带'}}
                        </template>
-                    <template slot-scope="{row}" v-else>{{row[column.prop]}}</template>
+                    <template v-else>{{row[column.prop]}}</template>
+                        </template>
                    </el-table-column>
                    <el-table-column label="操作" width="250px">
                        <template slot-scope="{row}">
@@ -1165,6 +1199,7 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                signUpModeList: [],
                viewData: {},
                applyUserRow: {},
+                listRequestId: 0,
                agencyLists: [],
                unionId: "${@com.budwk.app.zhgh.staffbenefit.therapyRecuperation.support.TherapyContext.getUnionId()}",
                userFindDialogVisible: false,
@@ -1737,9 +1772,12 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                }
            },
            getSelfUnionUser() {
+                const requestId = ++this.listRequestId
+                const viewKey = this.pageForm.state + '-' + this.pageForm.lb
                this.tableLoading = true
                this.tableData = []
-                $.post(loc() + "/getSelfUnionUser", this.pageForm, (data) => {
+                return $.post(loc() + "/getSelfUnionUser", this.pageForm, (data) => {
+                    if (requestId !== this.listRequestId || viewKey !== this.pageForm.state + '-' + this.pageForm.lb) return
                    this.tableLoading = false
                    if (data.code === 0) {
                        this.tableData = data.data.list;
@@ -1840,7 +1878,8 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                    await this.getRyData()
                }
                await this.getApplyNum()
-                this.$refs.table_tool.getColumns()
+                await this.$nextTick()
+                if (this.$refs.table_tool) this.$refs.table_tool.getColumns()

            },
            async flushUnits() {
@@ -1871,9 +1910,12 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                this.jdList = data
            },
            getLxsData() {
+                const requestId = ++this.listRequestId
+                const viewKey = this.pageForm.state + '-' + this.pageForm.lb
                this.tableLoading = true
                this.tableData = []
-                $.post(loc() + "/getLxsData", this.pageForm, (data) => {
+                return $.post(loc() + "/getLxsData", this.pageForm, (data) => {
+                    if (requestId !== this.listRequestId || viewKey !== this.pageForm.state + '-' + this.pageForm.lb) return
                    this.tableLoading = false
                    if (data.code === 0) {
                        this.tableData = data.data.list;
@@ -1884,9 +1926,12 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                }, "json");
            },
            getJdData() {
+                const requestId = ++this.listRequestId
+                const viewKey = this.pageForm.state + '-' + this.pageForm.lb
                this.tableLoading = true
                this.tableData = []
-                $.post(loc() + "/getJdData", this.pageForm, (data) => {
+                return $.post(loc() + "/getJdData", this.pageForm, (data) => {
+                    if (requestId !== this.listRequestId || viewKey !== this.pageForm.state + '-' + this.pageForm.lb) return
                    this.tableLoading = false
                    if (data.code === 0) {
                        this.tableData = data.data.list;
@@ -1897,9 +1942,12 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                }, "json");
            },
            async getXlData() {
+                const requestId = ++this.listRequestId
+                const viewKey = this.pageForm.state + '-' + this.pageForm.lb
                this.tableLoading = true
                this.tableData = []
-                $.post(loc() + "/getXlData", this.pageForm, (data) => {
+                return $.post(loc() + "/getXlData", this.pageForm, (data) => {
+                    if (requestId !== this.listRequestId || viewKey !== this.pageForm.state + '-' + this.pageForm.lb) return
                    this.tableLoading = false
                    if (data.code === 0) {
                        this.tableData = data.data.list;
@@ -1910,9 +1958,12 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
                }, "json");
            },
            async getRyData() {
+                const requestId = ++this.listRequestId
+                const viewKey = this.pageForm.state + '-' + this.pageForm.lb
                this.tableLoading = true
                this.tableData = []
-                $.post(loc() + "/getRyData", this.pageForm, (data) => {
+                return $.post(loc() + "/getRyData", this.pageForm, (data) => {
+                    if (requestId !== this.listRequestId || viewKey !== this.pageForm.state + '-' + this.pageForm.lb) return
                    this.tableLoading = false
                    if (data.code === 0) {
                        this.tableData = data.data.list;
@@ -771,9 +771,9 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/platform.html"){
            openLine(row) {
                this.$refs.guava.public()
                if (row.regionalNature === "省内") {
-                    this.$refs.viewLineInfo.findOne(row.lineId, null)
+                    this.$refs.viewLineInfo.findOne(row.lineId, null, row.signUpMode, row.year)
                } else {
-                    this.$refs.viewLineInfo.findOne(row.lineId, row.usUnionId)
+                    this.$refs.viewLineInfo.findOne(row.lineId, row.usUnionId, row.signUpMode, row.year)

                }
            },
@@ -253,7 +253,8 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
                window.history.back()
            },
            async toLineList(index) {
-                /*const isExist = await getScopeUser(this.configData.activityGroupId)
+                if (this.configLoading) return
+                const isExist = this.configData.activityGroupId && await getScopeUser(this.configData.activityGroupId)
                if (!isExist) {
                    vant.Dialog.alert({
                        title: '温馨提示',
@@ -261,7 +262,7 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
                        confirmButtonColor: '#1867b0'
                    })
                    return
-                }*/
+                }
                localStorage.setItem("clickIndex", JSON.stringify({clickIndex: index}))
                location.href = '/platform/inclusiveTherapyV3/mobile/mobileLineListPage'
            },
@@ -221,7 +221,7 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
 <div id="app" v-cloak>

    <van-sticky>
-        <van-nav-bar @click-left="history.go(-1)" fixed left-arrow placeholder
+        <van-nav-bar @click-left="historyBack()" fixed left-arrow placeholder
                     title="普惠疗休养-线路介绍"></van-nav-bar>
    </van-sticky>

@@ -344,7 +344,7 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){

    <!--报名弹出框-->
    <van-popup v-model:show="joinPopup" position="right" class="joinPopup">
-        <van-nav-bar @click-left="signType == '2' ? history.go(-1) : joinPopup = false" fixed left-arrow placeholder title="疗休养报名"></van-nav-bar>
+        <van-nav-bar @click-left="signType == '2' ? historyBack() : joinPopup = false" fixed left-arrow placeholder title="疗休养报名"></van-nav-bar>
        <div class="join_content">

            <van-form @submit="joinSubmit">
@@ -415,7 +415,7 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
                    <template v-if="configData.familyInfo === 2">
                        <div v-if="formData.companionList.length > 0" class="van-card-body">
                            <van-tabs v-model="active" type="card" color="#0e78c5" animated>
-                                <van-tab v-for="item, index in formData.companionList" :title="'随行人' + (index + 1)">
+                                <van-tab v-for="(item, index) in formData.companionList" :key="item.id || index" :title="'随行人' + (index + 1)">
                                    <van-field label="姓名" name="userName" placeholder="请填写姓名"
                                               v-model="item.userName"
                                               :rules="[{ required: true }]"></van-field>
@@ -576,6 +576,10 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
            }
        },
        methods: {
+            moment,
+            historyBack() {
+                window.history.back()
+            },
            roomCancel() {
                if (!this.self) {
                    this.formData.companionList[this.active].bedInfo.bedType = ''
@@ -6,7 +6,6 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
    #app {
        font-family: 微软雅黑, serif;
        min-height: 100vh;
-        background: #f7f8fa;
    }

    .van-doc-card {
@@ -301,11 +300,215 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
        background: #f5f9ff;
    }

+    #app.therapy-mobile .van-nav-bar,
+    #app.therapy-mobile .van-sticky--fixed { background: #fff; }
+    #app.therapy-mobile .van-nav-bar__title { color: #172033; font-size: 16px; font-weight: 600; }
+
+    #app.therapy-mobile .line-toolbar {
+        padding: 22px 12px 1px;
+        box-sizing: border-box;
+    }
+
+    #app.therapy-mobile .line-search-row {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        margin-bottom: 8px;
+    }
+
+    #app.therapy-mobile .line-search {
+        flex: 1;
+        min-width: 0;
+        margin: 0;
+        padding: 0;
+    }
+
+    #app.therapy-mobile .line-search .van-search {
+        height: 42px;
+        padding: 0;
+        overflow: hidden;
+        border: 0;
+        border-radius: 12px;
+        background: #fff;
+        box-shadow: 0 5px 16px rgba(43, 73, 112, .1);
+    }
+
+    #app.therapy-mobile .line-search .van-search__content {
+        height: 42px;
+        padding-left: 12px;
+        align-items: center;
+        border-radius: 12px;
+        background: #fff;
+    }
+
+    #app.therapy-mobile .line-search .van-field__control { color: #263548; font-size: 14px; }
+    #app.therapy-mobile .line-search .van-field__control::placeholder { color: #a7b0bf; }
+    #app.therapy-mobile .line-search .van-search__action {
+        padding: 0 10px;
+        color: #1989fa;
+        font-size: 14px;
+        font-weight: 500;
+    }
+
+    #app.therapy-mobile .line-type-selector {
+        flex: 0 0 112px;
+        min-width: 0;
+        overflow: hidden;
+        border-radius: 12px;
+        background: #fff;
+        box-shadow: 0 5px 16px rgba(43, 73, 112, .1);
+    }
+
+    #app.therapy-mobile .line-type-selector .van-dropdown-menu__bar {
+        height: 42px;
+        border: 0;
+        background: #fff;
+        box-shadow: none;
+    }
+
+    #app.therapy-mobile .line-type-selector .van-dropdown-menu__title {
+        padding: 0 16px 0 0;
+        color: #66758a;
+        font-size: 14px;
+        font-weight: 400;
+    }
+
+    #app.therapy-mobile .line-filter-dropdowns {
+        display: block;
+        margin: 0 0 10px;
+        overflow: hidden;
+        border-radius: 10px;
+        box-shadow: 0 5px 16px rgba(43, 73, 112, .08);
+    }
+
+    #app.therapy-mobile .line-filter-dropdowns .van-dropdown-menu__bar {
+        height: 44px;
+        border: 0;
+        background: #fff;
+        box-shadow: none;
+    }
+
+    #app.therapy-mobile .line-filter-dropdowns .van-dropdown-menu__title {
+        display: inline-flex;
+        align-items: center;
+        max-width: 100%;
+        height: 44px;
+        color: #66758a;
+        font-size: 14px;
+        font-weight: 400;
+        line-height: 20px;
+    }
+
+    #app.therapy-mobile .line-toolbar .van-dropdown-menu__title--active,
+    #app.therapy-mobile .line-toolbar .van-dropdown-item__option--active {
+        color: #1989fa;
+    }
+
+    #app.therapy-mobile .line-toolbar .van-dropdown-item__content {
+        width: auto;
+        max-width: none;
+        max-height: 50vh;
+        margin: 0;
+        box-sizing: border-box;
+        overflow-x: hidden;
+        overflow-y: auto;
+        border-radius: 0 0 12px 12px;
+        box-shadow: 0 10px 24px rgba(31, 65, 108, .14);
+    }
+
+    #app.therapy-mobile .line-type-selector .van-dropdown-item__content {
+        left: auto;
+        right: max(12px, calc((100vw - 640px) / 2 + 12px));
+        width: 112px;
+    }
+
+    #app.therapy-mobile .line-status-selector .van-dropdown-item__content {
+        left: max(12px, calc((100vw - 640px) / 2 + 12px));
+        right: auto;
+        width: calc(50% - 12px);
+        max-width: 308px;
+    }
+
+    #app.therapy-mobile .line-source-selector .van-dropdown-item__content {
+        left: auto;
+        right: max(12px, calc((100vw - 640px) / 2 + 12px));
+        width: calc(50% - 12px);
+        max-width: 308px;
+    }
+
+    #app.therapy-mobile .line-toolbar .van-dropdown-item__option {
+        display: flex;
+        align-items: center;
+        min-height: 48px;
+        padding: 12px;
+        box-sizing: border-box;
+        font-size: 14px;
+    }
+
+    #app.therapy-mobile .line-toolbar .van-dropdown-item__option .van-cell__title {
+        flex: 1 1 auto;
+        min-width: 0;
+        line-height: 22px;
+        overflow-wrap: anywhere;
+    }
+
+    #app.therapy-mobile .line-toolbar .van-dropdown-item__option .van-cell__value {
+        display: flex;
+        flex: 0 0 20px;
+        align-items: center;
+        justify-content: flex-end;
+        overflow: visible;
+        line-height: 22px;
+    }
+
+    #app.therapy-mobile .line-toolbar .van-dropdown-item__icon { margin-left: 4px; }
+
+    #app.therapy-mobile .list-card {
+        margin: 4px 10px 14px;
+        border: 0;
+        border-radius: 16px;
+        box-shadow: 0 8px 24px rgba(49, 85, 145, .06);
+    }
+
+    #app.therapy-mobile .list-card > .content {
+        align-items: center;
+        padding: 18px 12px;
+    }
+
+    #app.therapy-mobile .line-thumb {
+        flex: 0 0 30%;
+        min-width: 0;
+    }
+
+    #app.therapy-mobile .line-thumb .van-image {
+        width: 100% !important;
+        height: 126px !important;
+        overflow: hidden;
+        border-radius: 12px;
+    }
+
+    #app.therapy-mobile .line-thumb img { object-fit: cover; }
+    #app.therapy-mobile .line-title-row { align-items: center; gap: 6px; }
+    #app.therapy-mobile .line-title-text { color: #101b38; font-size: 15px !important; line-height: 24px; }
+    #app.therapy-mobile .desc_info > div { line-height: 25px; color: #58627b; }
+    #app.therapy-mobile .group-tag { padding: 3px 6px; font-size: 11px; line-height: 17px; }
+    #app.therapy-mobile .van-list__finished-text { font-size: 14px; color: #8c93a3; }
+
+    @media (max-width: 350px) {
+        #app.therapy-mobile .line-type-selector { flex-basis: 100px; }
+        #app.therapy-mobile .line-type-selector .van-dropdown-item__content { width: 100px; right: 10px; }
+        #app.therapy-mobile .line-status-selector .van-dropdown-item__content { left: 10px; width: calc(50% - 10px); }
+        #app.therapy-mobile .line-source-selector .van-dropdown-item__content { right: 10px; width: calc(50% - 10px); }
+        #app.therapy-mobile .line-search-row { gap: 8px; }
+        #app.therapy-mobile .line-toolbar { padding-right: 10px; padding-left: 10px; }
+        #app.therapy-mobile .line-title-row { flex-wrap: wrap; }
+        #app.therapy-mobile .line-title-text { flex-basis: 100%; }
+    }
 </style>

 <div id="app" class="therapy-mobile" v-cloak v-if="isLoad">
-    <van-sticky>
-        <van-nav-bar @click-left="historyBack" fixed left-arrow placeholder title="疗休养线路"></van-nav-bar>
+    <van-nav-bar @click-left="historyBack" fixed left-arrow placeholder title="疗休养线路"></van-nav-bar>
+    <van-sticky offset-top="46px">


        <!--<van-dropdown-menu>
@@ -313,60 +516,49 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
                               @change="doSearch"></van-dropdown-item>
        </van-dropdown-menu>-->

-        <van-notice-bar v-if="schoolTime != '' && schoolTime != null" mode="closeable">
-            您的入校时间为{{schoolTime}}，疗休养额度为1500。
-        </van-notice-bar>

-        <!--按钮导航-->
-        <div class="choose_button van-doc-card">
-            <van-grid :column-num="chooseButton.length" :border="false">
-                <van-grid-item @click="pageForm.theRapyRecuperationType = item.value; doSearch()"
-                               v-for="item in chooseButton">
-                    <div :class="['type-icon', pageForm.theRapyRecuperationType == item.value ? 'active-icon' : '']">
-                        <van-image :src="item.imgUrl"></van-image>
-                    </div>
-                    <div :style="pageForm.theRapyRecuperationType == item.value ? 'color: #1867b0; font-weight: bold' : 'color: black; font-weight: normal'"
-                         class="button_text">{{item.label}}
-                    </div>
-                </van-grid-item>
-            </van-grid>
-
-            <van-divider></van-divider>
-
-            <div class="line-filter-dropdowns"
-                 v-if="['0', 0, '1', 1].includes(pageForm.theRapyRecuperationType)">
-                <van-dropdown-menu>
+        <div class="line-toolbar">
+            <div class="line-search-row">
+                <div class="line-search">
+                    <van-search
+                            v-model="pageForm.lineKeyword"
+                            placeholder="请输入线路名称"
+                            show-action
+                            @clear="doSearch"
+                            @search="doSearch">
+                        <template #action>
+                            <div @click="doSearch">搜索</div>
+                        </template>
+                    </van-search>
+                </div>
+                <van-dropdown-menu class="line-type-selector">
                    <van-dropdown-item
+                            :value="Number(pageForm.theRapyRecuperationType)"
+                            :options="therapyTypeOptions"
+                            @change="changeTherapyType">
+                    </van-dropdown-item>
+                </van-dropdown-menu>
+            </div>
+            <van-dropdown-menu class="line-filter-dropdowns" active-color="#1989fa"
+                 v-if="['0', 0, '1', 1].includes(pageForm.theRapyRecuperationType)">
+                    <van-dropdown-item class="line-status-selector"
                            v-model="pageForm.signUpStatus"
                            :options="signUpStatusOptions"
                            @change="changeSignUpStatus">
                    </van-dropdown-item>
-                </van-dropdown-menu>
-                <van-dropdown-menu>
-                    <van-dropdown-item
+                    <van-dropdown-item class="line-source-selector"
                            v-model="pageForm.lineUnionType"
                            :options="lineUnionTypeOptions"
                            @change="changeLineUnionType">
                    </van-dropdown-item>
-                </van-dropdown-menu>
-            </div>
-
-            <div class="line-search">
-                <van-search
-                        v-model="pageForm.lineKeyword"
-                        label="线路"
-                        placeholder="请输入线路名称"
-                        show-action
-                        @clear="doSearch"
-                        @search="doSearch">
-                    <template #action>
-                        <div @click="doSearch">搜索</div>
-                    </template>
-                </van-search>
-            </div>
+            </van-dropdown-menu>

        </div>
    </van-sticky>
+        <van-notice-bar v-if="schoolTime != '' && schoolTime != null" mode="closeable">
+            您的入校时间为{{schoolTime}}，疗休养额度为1500。
+        </van-notice-bar>
+
    <van-list
            :finished="finished"
            :immediate-check="true"
@@ -623,6 +815,9 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
            }
        },
        computed: {
+            therapyTypeOptions() {
+                return this.chooseButton.map(item => ({text: item.label, value: Number(item.value)}))
+            },
            filteredUnionColumns() {
                if (!this.unionKeyword) {
                    return this.unionColumns
@@ -631,6 +826,8 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
            }
        },
        methods: {
+            moment,
+            CREATE_PREVIEW_URL,
            historyBack() {
                window.history.back()
            },
@@ -743,15 +940,19 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){
                    this.resetToCurrentUnionLine()
                }
            },
-            doSearch() {
-                this.loading = true
-                this.finished = false
+            changeTherapyType(type) {
+                this.pageForm.theRapyRecuperationType = type
                if (this.pageForm.theRapyRecuperationType == 0 || this.pageForm.theRapyRecuperationType == 1) {
                    // 省内、省外线路默认按当前登录人所属分工会筛选，避免首屏展示全部线路。
                    this.selectedOtherUnionName = ''
                    this.pageForm.unionId = "${@com.budwk.app.zhgh.staffbenefit.therapyRecuperation.support.TherapyContext.getPrincipalProperty('union').getId()}"
                    this.$set(this.pageForm, 'lineUnionType', 1)
                }
+                this.doSearch()
+            },
+            doSearch() {
+                this.loading = true
+                this.finished = false
                this.getData()
            },
            async join(o) {
@@ -21,7 +21,7 @@ layout("/platform/zhgh/staffbenefit/therapyRecuperation/layouts/mobile.html"){

 <div id="app" v-cloak>
    <van-sticky>
-        <van-nav-bar @click-left="history.back()" fixed left-arrow placeholder
+        <van-nav-bar @click-left="historyBack" fixed left-arrow left-text="返回" placeholder
                     title="报名人员"></van-nav-bar>
    </van-sticky>