This commit is contained in:
@jyuhsin
2025-05-29 16:33:43 +08:00
parent 94db56a6d4
commit 5346297c7d
22 changed files with 4533 additions and 843 deletions
@@ -3,12 +3,6 @@ layout("/mobile/platform.html"){
#-->
<style>
.container {
height: calc(100vh - 46px - 50px - 60px);
overflow-y: auto;
position: relative;
}
.container img {
background-size: contain;
width: 100%;
@@ -26,10 +20,6 @@ layout("/mobile/platform.html"){
padding: 0px 10px 56px 10px;
}
.backTop {
display: none !important;
}
.title {
font-weight: bold;
font-size: 19px;
@@ -55,6 +45,10 @@ layout("/mobile/platform.html"){
height: 30px;
}
.backTop {
display: none !important;
}
.footer {
background-color: white;
position: fixed;
@@ -157,7 +151,7 @@ layout("/mobile/platform.html"){
.top_icon {
position: fixed;
bottom: 130px;
bottom: 80px;
right: 20px;
}
@@ -253,7 +247,7 @@ layout("/mobile/platform.html"){
.pdf_div {
padding-bottom: 12px;
height: calc(100vh - 46px - 178px - 24px - 60px - 70px);
height: 800px;
}
</style>
@@ -261,7 +255,7 @@ layout("/mobile/platform.html"){
<div id="app" v-cloak>
<van-sticky>
<van-nav-bar @click-left="history.back()" fixed left-arrow placeholder title="职工疗休养-酒店介绍"></van-nav-bar>
<van-nav-bar @click-left="pageBack" fixed left-arrow placeholder title="职工疗休养-酒店介绍"></van-nav-bar>
</van-sticky>
<!--线路详情-->
@@ -610,6 +604,13 @@ layout("/mobile/platform.html"){
}
},
methods: {
pageBack() {
if(this.fromUrlByMy !== 'find') {
pjaxReplace('/platform/mobile/theRapyRecuperation/mobileLineListPage')
} else {
pjaxReplace('/platform/mobile/theRapyRecuperation/myRecuperation')
}
},
calConfirm(date) {
const start = moment(date[0]).format('MM月DD日')
const end = moment(date[1]).format('MM月DD日')
@@ -983,6 +984,42 @@ layout("/mobile/platform.html"){
}
this.show = false
},
handleClick(event, classArray = [], imagesArray = []) {
if (event.target.tagName === 'IMG' && event.target.className !== 'top_icon') {
if(imagesArray.length > 0) {
const index = classArray.indexOf(event.target.className)
if(index !== -1) {
vant.ImagePreview({
images: imagesArray,
startPosition: index,
closeable: true,
})
}
} else {
vant.ImagePreview({
images: [event.target.src],
closeable: true,
})
}
}
},
readPDFPicture(pdf) {
const that = this
if(pdf != null) {
pdf.on("complete", function () {
const imgDoc = document.querySelectorAll('img')
let array = []
let classArray = []
imgDoc.forEach(o => {
if(o.getAttribute('class') !== 'top_icon') {
classArray.push(o.getAttribute('class'))
array.push(o.getAttribute('src'))
}
})
document.addEventListener('click', (event) => that.handleClick(event, classArray, array))
})
}
},
},
async created() {
this.id = getQueryString('id') ? getQueryString('id') : ''
@@ -1007,42 +1044,11 @@ layout("/mobile/platform.html"){
})
}catch (e) {
this.isPdf = true
document.addEventListener('click', function (event) {
// 打印被点击的元素标签名和 class
if (event.target.tagName === 'IMG' && event.target.className !== 'top_icon') {
vant.ImagePreview({
images: [event.target.src],
closeable: true,
})
}
})
document.addEventListener('click', (event) => this.handleClick(event))
}
this.$nextTick(() => {
pdfh5.on("complete", function () {
const imgDoc = document.querySelectorAll('img')
let array = []
let classArray = []
imgDoc.forEach(o => {
if(o.getAttribute('class') !== 'top_icon') {
classArray.push(o.getAttribute('class'))
array.push(o.getAttribute('src'))
}
})
document.addEventListener('click', function (event) {
// 打印被点击的元素标签名和 class
if (event.target.tagName === 'IMG' && event.target.className !== 'top_icon') {
const index = classArray.indexOf(event.target.className)
if(index !== -1) {
vant.ImagePreview({
images: array,
startPosition: index,
closeable: true,
})
}
}
})
})
this.readPDFPicture(pdfh5)
})
},
mounted() {
@@ -1050,6 +1056,7 @@ layout("/mobile/platform.html"){
},
destroyed() {
window.removeEventListener('scroll', this.scrollToTop)
document.removeEventListener('click', (event) => this.handleClick(event))
},
})
</script>
@@ -31,6 +31,11 @@ layout("/mobile/platform.html"){
padding-left: 7px;
}
.pdfjs {
height: 90%;
overflow-y: auto;
}
</style>
<div id="app" v-cloak>
@@ -60,13 +65,15 @@ layout("/mobile/platform.html"){
</div>
<!--疗休养描述-->
<div class="van-doc-card" style="margin-top: 20px">
<div class="van-doc-card" style="margin-top: 20px; height: calc(100vh - 200px)">
<van-image width="190" height="43" src="/assets/mobile/img/therapyRecuperation/title.png"></van-image>
<div class="pre_text" v-html="configData.notice"></div>
<div v-if="isPdf" class="pre_text" v-html="configData.notice"></div>
<div v-else id="demo" class="pdf_div"></div>
</div>
</div>
<script>
let pdfh5 = null
const vue = new Vue({
el: '#app',
mixins: [mobileMixins],
@@ -74,6 +81,7 @@ layout("/mobile/platform.html"){
return {
chooseButton: [],
configData: {},
isPdf: false,
}
},
methods: {
@@ -94,11 +102,63 @@ layout("/mobile/platform.html"){
const resp = await $.get('/platform/theRapyRecuperation/TheRapyConfig/findOne')
this.configData = resp.data
},
initPdf() {
try {
const parser = new DOMParser();
const doc = parser.parseFromString(this.configData.notice, 'text/html');
const link = doc.querySelector('a');
const href = link.getAttribute('href');
this.$nextTick(() => {
pdfh5 = new Pdfh5('#demo', {
pdfurl: href,
});
})
}catch (e) {
this.isPdf = true
document.addEventListener('click', function (event) {
// 打印被点击的元素标签名和 class
if (event.target.tagName === 'IMG' && !['van-image__img', 'top_icon'].includes(event.target.className)) {
vant.ImagePreview({
images: [event.target.src],
closeable: true,
})
}
})
}
this.$nextTick(() => {
pdfh5.on("complete", function () {
const imgDoc = document.querySelectorAll('img')
let array = []
let classArray = []
imgDoc.forEach(o => {
if(!['van-image__img', 'top_icon'].includes(o.getAttribute('class'))) {
classArray.push(o.getAttribute('class'))
array.push(o.getAttribute('src'))
}
})
document.addEventListener('click', function (event) {
// 打印被点击的元素标签名和 class
if (event.target.tagName === 'IMG' && !['van-image__img', 'top_icon'].includes(event.target.className)) {
const index = classArray.indexOf(event.target.className)
if(index !== -1) {
vant.ImagePreview({
images: array,
startPosition: index,
closeable: true,
})
}
}
})
})
})
}
},
async created() {
this.chooseButton = await getEnumOptions('TheRapyRecuperationType')
this.chooseButton = this.chooseButton.filter(o => o.value !== 2)
await this.getConfigData()
this.initPdf()
}
})
</script>
@@ -590,9 +590,12 @@ layout("/mobile/platform.html"){
'mobile-sign': httpVueLoader('/components/sign/mobileSign.vue?v=' + new Date().getTime()),
},
methods: {
pageBack(){
pjaxReplace('/platform/mobile/theRapyRecuperation/mobileLineListPage')
pageBack() {
if(this.fromUrlByMy !== 'find') {
pjaxReplace('/platform/mobile/theRapyRecuperation/mobileLineListPage')
} else {
pjaxReplace('/platform/mobile/theRapyRecuperation/myRecuperation')
}
},
openRead() {
this.readVisible = true
@@ -790,13 +793,20 @@ layout("/mobile/platform.html"){
const resp = await $.get('/platform/theRapyRecuperation/TheRapyConfig/findOne')
this.configData = resp.data
},
handleClick(event, classArray = []) {
handleClick(event, classArray = [], imagesArray = []) {
if (event.target.tagName === 'IMG' && event.target.className !== 'top_icon') {
const index = classArray.indexOf(event.target.className)
if(index !== -1) {
if(imagesArray.length > 0) {
const index = classArray.indexOf(event.target.className)
if(index !== -1) {
vant.ImagePreview({
images: imagesArray,
startPosition: index,
closeable: true,
})
}
} else {
vant.ImagePreview({
images: array,
startPosition: index,
images: [event.target.src],
closeable: true,
})
}
@@ -814,7 +824,7 @@ layout("/mobile/platform.html"){
array.push(o.getAttribute('src'))
}
})
document.addEventListener('click', (event) => this.handleClick(event, classArray))
document.addEventListener('click', (event) => that.handleClick(event, classArray, array))
})
}
},
@@ -284,7 +284,7 @@ layout("/mobile/platform.html"){
</div>
<div v-if="pageForm.theRapyRecuperationType == '3'" style="text-align: right; padding-right: 10px; padding-bottom: 10px" class="sign_button">
<van-button @click.stop="openSignUser(o, 'baseManage')" size="mini"
<van-button @click.stop="openSignUser(o, 'baseManagement')" size="mini"
type="info" color="#1867B0">查看人员</van-button>
</div>
File diff suppressed because it is too large Load Diff
@@ -17,6 +17,94 @@ layout("/mobile/platform.html"){
transform: none;
}
/* 表格样式 */
.table-container {
background-color: white;
border-radius: 12px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
overflow: hidden;
margin: 10px auto;
width: 94%;
}
.table-header {
padding: 12px;
border-bottom: 1px solid #f5f5f5;
display: flex;
justify-content: space-between;
align-items: center;
}
.table-header h3 {
font-size: 15px;
font-weight: 500;
display: flex;
align-items: center;
}
.table-icon {
margin-right: 6px;
}
.toggle-button {
color: #1989fa;
font-size: 13px;
display: flex;
align-items: center;
}
.toggle-icon {
margin-left: 2px;
font-size: 12px;
}
.data-table {
width: 100%;
border-collapse: collapse;
}
.data-table th, .data-table td {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.data-table th {
background-color: #f7f8fa;
padding: 10px 8px;
text-align: center;
font-weight: normal;
color: #666;
font-size: 13px;
}
.data-table td {
padding: 12px 8px;
border-bottom: 1px solid #f5f5f5;
font-size: 14px;
text-align: center;
}
/* 表格横向滚动容器 */
.table-scroll {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
/* 无数据提示 */
.no-data {
padding: 24px 0;
text-align: center;
color: #999;
}
.empty-icon {
font-size: 24px;
color: #ddd;
margin-bottom: 8px;
display: block;
}
</style>
<div id="app" v-cloak>
@@ -26,7 +114,7 @@ layout("/mobile/platform.html"){
</van-sticky>
<van-search v-model="searchKeyWord" placeholder="请输入姓名查询" @search="getSignUser"></van-search>
<template v-if="Object.keys(signUserData).length > 0">
<!--<template v-if="Object.keys(signUserData).length > 0">
<van-index-bar :sticky-offset-top="46" :index-list="Object.keys(signUserData)">
<template v-for="(value, key) in signUserData">
<van-index-anchor :index="key"></van-index-anchor>
@@ -34,7 +122,34 @@ layout("/mobile/platform.html"){
</template>
</van-index-bar>
</template>
<van-empty v-else description="暂无报名人员"></van-empty>
<van-empty v-else description="暂无报名人员"></van-empty>-->
<div class="table-container">
<div v-if="signUserData.length > 0" class="table-scroll">
<table class="data-table">
<thead>
<tr>
<th>姓名</th>
<th>性别</th>
<th v-if="type !== 'baseManagement'">所属工会</th>
<th v-if="type === 'baseManagement'">出行时间</th>
</tr>
</thead>
<tbody>
<tr v-for="(row, index) in signUserData" :key="index">
<td>{{row.userName}}</td>
<td>{{row.sex}}</td>
<td v-if="type !== 'baseManagement'">{{row.unionName}}</td>
<td v-if="type === 'baseManagement'">{{row.specificTime}}</td>
</tr>
</tbody>
</table>
</div>
<div v-else class="no-data">
<span class="empty-icon">&#128472;</span>
暂无数据
</div>
</div>
</div>
<script>
@@ -59,7 +174,11 @@ layout("/mobile/platform.html"){
},
methods: {
async getSignUser() {
const params = this.type === 'line' ? {usId: this.id, searchKeyWord: this.searchKeyWord} : {travelId: this.id, searchKeyWord: this.searchKeyWord}
const params = {
searchKeyWord: this.searchKeyWord,
id: this.id,
type: this.type
}
const toast = vant.Toast.loading({
duration: 0,
forbidClick: true,