Yizhan-app/pages/firstAid/index.vue

121 lines
2.5 KiB
Vue

<template>
<view class="first_main" :style="{height: screenHeight + 'px'}">
<nav-bar title='急救指南' :backGround="false">
<template v-slot:right>
<image style="width: 100%;height: 100%;" src="/static/index3/location.png" @click="locationClick()"></image>
</template>
</nav-bar>
<view class="content">
<view class="list_scoll" id="paging_id" :style="{height: scrollH + 'px'}">
<view class="img_item" v-for="(item,index) in listData" :key="item.id">
<image :src="item.logoAddress" @click="jumpDetail(item)" @error="imgError(item,index)"></image>
</view>
</view>
</view>
</view>
</template>
<script>
import {
callbackRequest
} from '@/common/util.js';
import {
firstaIdList
} from '@/common/api.js';
import navBar from "@/components/navBar/index.vue";
export default {
components: {
navBar
},
data() {
return {
listData: [],
screenHeight: '',
scrollH: ''
}
},
onLoad() {
this.screenHeight = uni.getSystemInfoSync().safeArea.height
this.getData()
},
mounted() {
const query = uni.createSelectorQuery().in(this);
query.select("#paging_id").boundingClientRect((data) => {
this.scrollH = this.screenHeight - data.top
}).exec();
},
methods: {
back() {
uni.navigateBack()
},
locationClick() {
uni.navigateTo({
url: '/pages/device/firstAid'
})
},
getData() {
let params = {
method:firstaIdList,
firstAidName: '',
publishStatus: '1',
isDeleted: '0'
}
callbackRequest(params).then((res) => {
if (res.returnCode == 1) {
this.listData = res.returnData
}else{
uni.showToast({title: res.returnMsg,icon: 'none'});
}
})
},
imgError(e,i) {
// this.listData[i].logoAddress = '../../static/imgs/23441.png'
},
jumpDetail(item) {
uni.navigateTo({
url: `/pages/firstAid/detail?id=${item.id}&name=${item.firstAidName}`
})
}
}
}
</script>
<style scoped lang="scss">
.first_main {
width: 100vw;
background-image: url('../../static/firstaid/background.png');
background-size: 100% 932rpx;
background-repeat: no-repeat;
background-color: #ffffff;
}
.first_main::-webkit-scrollbar {
width: 0;
height: 0;
}
.list_scoll {
position: fixed;
top: 428rpx;
width: 100%;
padding: 20rpx 48rpx;
box-sizing: border-box;
overflow: auto;
}
.list_scoll::-webkit-scrollbar {
width: 0;
height: 0;
}
.img_item {
width: 100%;
height: 192rpx;
margin-bottom: 28rpx;
image {
width: 100%;
height: 100%;
}
}
</style>