143 lines
2.7 KiB
Vue
143 lines
2.7 KiB
Vue
|
<template>
|
||
|
|
<view class="view-page">
|
||
|
|
<headerHeight />
|
||
|
|
<navBar :navTitle="'问题详情'" bgColor="#fff" :emitBack="true" @backEvent="back">
|
||
|
|
</navBar>
|
||
|
|
<view class="container" v-if="detailData">
|
||
|
|
<view class="title">
|
||
|
|
{{detailData.title}}
|
||
|
|
</view>
|
||
|
|
<view class="title mt-24" v-html="detailData.content">
|
||
|
|
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="flex-line footer mt-24 w-fill">
|
||
|
|
<view class="help-box">
|
||
|
|
<view class="help-icon">
|
||
|
|
<uni-icons type="hand-up" size="30"></uni-icons>
|
||
|
|
</view>
|
||
|
|
<view class="color-0 mt-24 font-24">
|
||
|
|
有帮助
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="help-box">
|
||
|
|
<view class="help-icon">
|
||
|
|
<uni-icons type="hand-down" size="30"></uni-icons>
|
||
|
|
</view>
|
||
|
|
<view class="color-0 mt-24 font-24">
|
||
|
|
没帮助
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import http from '@/until/http.js';
|
||
|
|
import headerHeight from '@/component/headerHeight.vue';
|
||
|
|
import navBar from '@/component/nav.vue';
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
headerHeight,
|
||
|
|
navBar
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
errorPage: false,
|
||
|
|
detailData: null,
|
||
|
|
statusBarHeight:0
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onLoad(options) {
|
||
|
|
const {
|
||
|
|
id
|
||
|
|
} = options
|
||
|
|
if (id) this.getDetail(id)
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
getDetail(id) {
|
||
|
|
http.get('/api/Help/help_detail', {
|
||
|
|
token: uni.getStorageSync('token') ?? '',
|
||
|
|
id: id
|
||
|
|
}).then(response => {
|
||
|
|
const {
|
||
|
|
data,
|
||
|
|
code
|
||
|
|
} = response
|
||
|
|
console.log(code, data)
|
||
|
|
this.detailData = code ? data : null
|
||
|
|
this.errorPage = false
|
||
|
|
}).catch(error => {
|
||
|
|
this.errorPage = true
|
||
|
|
});
|
||
|
|
},
|
||
|
|
back() {
|
||
|
|
uni.navigateBack()
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.view-page {
|
||
|
|
// padding: 32rpx;
|
||
|
|
width: 100vw;
|
||
|
|
min-height: 100vh;
|
||
|
|
background-color: #F8F8F8;
|
||
|
|
.status-bar{
|
||
|
|
background-color: #fff;
|
||
|
|
}
|
||
|
|
.nav {
|
||
|
|
padding: 32rpx;
|
||
|
|
width: calc(100% - 64rpx);
|
||
|
|
justify-content: start;
|
||
|
|
background-color: #fff;
|
||
|
|
|
||
|
|
.icon-image {
|
||
|
|
width: 48rpx;
|
||
|
|
height: 48rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title {
|
||
|
|
width: calc(100% - 48rpx);
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.container {
|
||
|
|
padding: 24rpx 32rpx;
|
||
|
|
|
||
|
|
.title {
|
||
|
|
background-color: #fff;
|
||
|
|
border-radius: 14rpx;
|
||
|
|
padding: 14rpx 24rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.footer {
|
||
|
|
display: inline-flex;
|
||
|
|
justify-items: center;
|
||
|
|
justify-content: space-evenly;
|
||
|
|
align-items: center;
|
||
|
|
// margin-top: ;
|
||
|
|
.help-box {
|
||
|
|
// display: inline-flex;
|
||
|
|
// flex-wrap: wrap;
|
||
|
|
// justify-items: center;
|
||
|
|
// justify-content: center;
|
||
|
|
// align-items: center;
|
||
|
|
text-align: center;
|
||
|
|
.help-icon {
|
||
|
|
width: 100rpx;
|
||
|
|
height: 100rpx;
|
||
|
|
background: #EFF2F8;
|
||
|
|
border-radius: 50%;
|
||
|
|
display: inline-flex;
|
||
|
|
justify-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|