daoji_h5/user/pages/feedback/detail.vue

121 lines
3.4 KiB
Vue
Raw Normal View History

2024-03-21 05:53:51 +00:00
<template>
<view class="box">
<view class="pl-lg pr-lg pb-lg fill-base">
<view class="box-item">
<view class="box-item-title f-paragraph pb-md text-bold flex">反馈类型</view>
<view class="radius-10 rel box-item-cont text-center">
<view class="box-item-bg" :style="{backgroundColor:primaryColor }"></view>
<text class="abs f-caption box-item-cont-text" :style="{color:primaryColor}">{{feedInfo.type_name}}</text>
</view>
</view>
<view class="box-item pt-md">
<view class="box-item-title f-paragraph pb-md text-bold flex">订单编号</view>
<view class="c-paragraph f-mini-title">{{feedInfo.order_code || '无'}}</view>
</view>
<view class="box-item pt-md">
<view class="box-item-title f-paragraph pb-md text-bold flex">反馈内容</view>
<view class="c-paragraph box-item-content f-paragraph fill-body pd-lg radius-16" >{{feedInfo.content || '无'}}</view>
</view>
<view class="box-item pt-md flex" v-if="feedInfo.images&&feedInfo.images.length">
<bolck v-for="(item,index) in feedInfo.images" :key="index">
<image @tap="$util.previewImage({current:item ,urls:feedInfo.images})" :src="item" mode="aspectFill" class="item-image radius-16" :class="index > 0 && 'ml-md'"></image>
</bolck>
</view>
<view class="box-item pt-md flex" v-if="feedInfo.video_url">
<video :src="feedInfo.video_url" class="item-image radius-16"></video>
</view>
<view class="c-caption f-caption pt-md">: 您反馈的意见问题平台不会透露给他人保护您的隐私</view>
<view class="box-item pt-md" v-if="feedInfo.status == 2">
<view class="box-item-title f-paragraph pb-md text-bold flex">平台回复</view>
<view class="c-paragraph f-paragraph fill-body pd-lg radius-16" style="white-space: pre-wrap">{{feedInfo.reply_content || '无'}}</view>
</view>
</view>
<view class="space-footer"></view>
</view>
</template>
<script>
import {
mapState,
mapActions,
mapMutations
} from "vuex"
export default {
data() {
return {
options: {},
feedInfo:{}
}
},
computed: mapState({
primaryColor: state => state.config.configInfo.primaryColor,
subColor: state => state.config.configInfo.subColor,
configInfo: state => state.config.configInfo,
userInfo: state => state.user.userInfo,
}),
onLoad(options) {
this.options = options
this.initIndex()
},
methods: {
async initIndex(refresh = false){
// #ifdef H5
if (!refresh && this.$jweixin.isWechat()) {
await this.$jweixin.initJssdk();
this.$jweixin.wxReady(() => {
this.$jweixin.hideOptionMenu()
})
}
// #endif
this.$util.showLoading()
let { id } = this.options
this.feedInfo = await this.$api.mine.feedbackInfo({id})
this.$util.hideAll()
this.$util.setNavigationBarColor({
bg: this.primaryColor
})
}
}
}
</script>
<style lang="scss">
page{
background-color: #fff;
}
.box-item {
.box-item-title {
padding-top: 40rpx;
}
.c-5A677E {
color: #5A677E;
}
.box-item-cont{
line-height: 47rpx;
height: 47rpx;
width: 146rpx;
overflow: hidden;
.box-item-bg{
width: 146rpx;
height: 47rpx;
opacity: 0.1;
}
.box-item-cont-text{
left: 0;
line-height: 47rpx;
top: 0;
width: 100%;
}
}
.item-image{
width: 216rpx;
height: 216rpx;
}
.box-item-content{
white-space: pre-wrap;
max-height: 400rpx;
overflow-y: scroll;
}
}
</style>