Files
UNION_NJUST/target/classes/views/mobile/therapyRecuperation/lineList.html
T
2026-09-23 09:38:39 +08:00

261 lines
8.4 KiB
HTML

<!--#
layout("/mobile/platform.html"){
#-->
<style>
.van-doc-card {
margin: 10px;
padding: 12px 12px 12px 12px;
background-color: #fff;
border-radius: 6px;
box-shadow: 0 8px 12px #ebedf0;
line-height: 20px;
position: relative;
}
.list-card {
position: relative;
margin: 10px;
background-color: #fff;
border-radius: 6px;
box-shadow: 0 8px 12px #ebedf0;
}
.list-card > .content {
padding: 16px 10px;
display: flex;
max-height: 100px;
}
.content-right {
width: calc(100% - 150px);
max-width: calc(100% - 150px);
padding-left: 15px;
overflow: hidden;
text-overflow: ellipsis;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.cr-title {
max-height: 40px;
line-height: 20px;
overflow: hidden;
font-weight: bold;
}
.van-grid-item__content {
padding: 0;
}
.choose_button .button_text {
font-size: 14px;
margin-top: 6px;
}
.concat, .mobile, .union {
font-size: 13px;
line-height: 18px;
width: 100%;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.footer {
background-color: white;
position: fixed;
bottom: 0;
width: 100%;
height: 60px;
display: flex;
justify-content: space-evenly;
align-items: center;
left: 0;
}
.footer .van-button {
height: 34px;
border-radius: 6px;
}
.active {
background-color: #1867b0;
color: white;
}
.no_active {
background-color: #e7e9f0;
color: #69707a;
}
.van-list {
padding-bottom: 10px;
}
</style>
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar @click-left="history.back()" fixed left-arrow placeholder title="疗休养线路"></van-nav-bar>
</van-sticky>
<!--按钮导航-->
<div class="choose_button van-doc-card">
<van-grid :column-num="4" :border="false">
<van-grid-item @click="pageForm.theRapyRecuperationType = item.value; getData()" v-for="item in chooseButton">
<van-image width="46" height="46" :src="item.imgUrl"></van-image>
<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>
</div>
<van-list
:finished="finished"
:immediate-check="true"
@load="onLoad"
finished-text="没有更多了"
v-model="loading">
<div @click="findOne(o)" class="list-card" v-for="o in tableData">
<div class="content">
<van-image
height="100"
radius="8"
:src="APP_DOMAIN + '/file_server/fileStreamPreview?id=' + o.fileId"
width="150"
></van-image>
<div v-if="pageForm.theRapyRecuperationType != '2'" class="content-right">
<div class="cr-title">
<van-tag color="#1867b0">{{o.playNumberOfDays}}日</van-tag>
<span>{{o.lineName}}</span>
</div>
<div>
<div class="union">
<span>部门工会:</span>{{o.usUnionName}}
</div>
<div class="concat">
<span>联系人:</span>{{o.contact}}
</div>
<div class="mobile">
<span>联系电话:</span>{{o.contactMobileNumber}}
</div>
</div>
</div>
<div v-if="pageForm.theRapyRecuperationType == '2'" class="content-right">
<div class="cr-title">
<span>{{o.travelAgencyName}}</span>
</div>
<div>
<div class="concat">
<span>联系人:</span>{{o.contact}}
</div>
<div class="mobile">
<span>联系电话:</span>{{o.contactMobileNumber}}
</div>
<div class="mobile">
<span>邮箱:</span>{{o.email}}
</div>
<div class="union" style="margin-top: 0">
<span>官网:</span><span style="color: #0e5996"
@click.stop="window.open(o.officialWebsite.indexOf('http') !== -1 ? o.officialWebsite : 'https://' + o.officialWebsite)">{{o.officialWebsite}}</span>
</div>
</div>
</div>
</div>
</div>
</van-list>
<div v-if="['0', '1', 0 , 1].includes(pageForm.theRapyRecuperationType)" class="footer">
<van-button @click="pageForm.lineUnionType = 2; unionPop = true" :class="pageForm.lineUnionType == 2 ? 'active' : 'no_active'">其他工会线路</van-button>
<van-button @click="pageForm.lineUnionType = 1; getData()" :class="pageForm.lineUnionType == 1 ? 'active' : 'no_active'">本公会线路</van-button>
</div>
<van-popup position="bottom" round v-model:show="unionPop">
<van-picker
show-toolbar title="选择部门工会"
:columns="unionColumns"
@confirm="onConfirm"
@cancel="unionPop = false"
></van-picker>
</van-popup>
</div>
<script>
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return decodeURI(r[2]);
return null;
}
const vue = new Vue({
el: '#app',
mixins: [mobileMixins],
data() {
return {
unionColumns: [],
unionPop: false,
chooseButton: [],
pageForm: {
theRapyRecuperationType: 0,
lineUnionType: 1,
unionId: "${@shiro.getPrincipalProperty('union').getId()}",
},
loading: false,
finished: false,
refreshing: false,
}
},
methods: {
onConfirm(value, index) {
this.pageForm.unionId = value.value
this.getData()
this.unionPop = false
},
async findOne(o) {
if(this.pageForm.theRapyRecuperationType != '2') {
location.href = '/platform/mobile/theRapyRecuperation/lineInfo?id=' + o.id + '&index=' + this.pageForm.theRapyRecuperationType
+ '&takePartInUnionId=' + o.takePartInUnionId
}
},
getData() {
this.loading = true
if(this.pageForm.lineUnionType === 1) {
this.pageForm.unionId = "${@shiro.getPrincipalProperty('union').getId()}"
}
this.pageForm.pageNumber = 1
this.tableData = []
this.onLoad()
},
async onLoad() {
const res = await $.post('/platform/theRapyRecuperation/line/enroll/pageData', this.pageForm)
if (res.code === 0 && res.data) {
this.tableData = this.tableData.concat(res.data.list)
if (this.tableData.length === res.data.totalCount) {
this.finished = true
} else {
this.pageForm.pageNumber++
}
}
this.loading = false
}
},
async created() {
this.pageForm.theRapyRecuperationType = getQueryString('index')
this.chooseButton = await getEnumOptions('TheRapyRecuperationType')
const unions = await getUnions(null)
unions.forEach(item => {
this.unionColumns.push({text: item.unionname, value: item.id})
})
}
})
</script>
<!--#
}
#-->