帮助中心页面优化,接口对接

version/0412
mujinxia 9 months ago
parent 2dae228a00
commit 863712fa1a
  1. 10
      api/user.js
  2. 383
      pages/news1/help.vue
  3. 29
      pages/news1/setting.vue

@ -6,10 +6,14 @@ const api = {
assets: 'user/assets', assets: 'user/assets',
bindMobile: 'user/bindMobile', bindMobile: 'user/bindMobile',
personal: 'user/personal', personal: 'user/personal',
todoCounts: "order/todoCounts" todoCounts: "order/todoCounts",
delUser: "user/delete",
} }
// 注销
// 当前登录的用户信息 export const delUser = (param) => {
return request.post(api.delUser, param)
}
// 当前登录的用户信息
export const info = (param, option) => { export const info = (param, option) => {
const options = { const options = {
isPrompt: true, //(默认 true 说明:本接口抛出的错误是否提示) isPrompt: true, //(默认 true 说明:本接口抛出的错误是否提示)

@ -2,17 +2,19 @@
<view class="help"> <view class="help">
<view class="helpContent"> <view class="helpContent">
<view class="helpTitle">帮助中心</view> <view class="helpTitle">帮助中心</view>
<view class="helpItem" v-for="(item,index) in itemList" :key="index"> <view class="helpItem" :class="((index == itemList.length - 1) && item.child.length == 0) ? 'border' : ''"
v-for="(item, index) in itemList" :key="index">
<view class="helpMain" @click="goListPage(item)"> <view class="helpMain" @click="goListPage(item)">
<u-icon name="arrow-left" class="zhishi" color="#dfdbdb" size="28"></u-icon> <u-icon name="arrow-left" class="zhishi" color="#dfdbdb" size="28"></u-icon>
<image :src="item.img_url" class="titleIcon" mode="widthFix"></image> <u-icon name="question-circle"></u-icon>
<!-- <image :src="item.img_url" class="titleIcon" mode="widthFix"></image> -->
<view class="mainText"> <view class="mainText">
<text>{{item.name}}</text> <text>{{ item.name }}</text>
<u-icon name="arrow-right" v-if="item.name!=''" color="#8B8B8B" size="22"></u-icon> <u-icon name="arrow-right" v-if="item.name != ''" color="#8B8B8B" size="22"></u-icon>
</view> </view>
</view> </view>
<view class="mainItem"> <view class="mainItem">
<view class="itemText" v-for="(p,i) in item.child" :key="i" @click="openContent(p)">{{p.title}} <view class="itemText" v-for="(p, i) in item.childArr" :key="i" @click="openContent(p)">{{ p.title }}
</view> </view>
</view> </view>
</view> </view>
@ -20,12 +22,12 @@
<view class="footer"> <view class="footer">
<view class="btn"> <view class="btn">
<button type="default" open-type="contact" class="infoBtn"> <button type="default" open-type="contact" class="infoBtn">
<image :src="$picUrl+'/static/news1/n7.png'" mode="widthFix"></image>在线客服9:00-22:00 <image :src="$picUrl + '/static/news1/n7.png'" mode="widthFix"></image>在线客服9:00-22:00
</button> </button>
</view> </view>
</view> </view>
<view class="dialog" v-if="dialog" @click="dialog=false"> <view class="dialog" v-if="dialog" @click="dialog = false">
<view class="content"> <view class="content">
<rich-text :nodes="strings"></rich-text> <rich-text :nodes="strings"></rich-text>
</view> </view>
@ -34,217 +36,230 @@
</template> </template>
<script> <script>
import * as help from '@/api/help' import * as help from '@/api/help'
export default { export default {
data() { data() {
return { return {
itemList: [], itemList: [],
strings: '', strings: '',
dialog: false, dialog: false,
} }
}, },
onShow() { onShow() {
this.getHelpList() this.getHelpList()
},
methods: {
goListPage(item) {
uni.navigateTo({
url: '/pages/news/rules/rulesList?itemInfo=' + JSON.stringify(item)
})
}, },
methods: { getHelpList() {
goListPage(item){ const that = this
uni.navigateTo({ help.helpList()
url:'/pages/news/rules/rulesList?itemInfo='+JSON.stringify(item) .then(res => {
}) if (res.status == 200) {
}, that.itemList = res.data.list;
getHelpList() { that.itemList.map(item => {
const that = this item.childArr = []
help.helpList() item.childArr = item.child.slice(0, 9)
.then(res => { })
if (res.status == 200) { }
that.itemList = res.data.list;
}
})
.finally(() => that.isLoading = false)
},
openContent(item) {
uni.navigateTo({
url:'/pages/news/rules/index?itemInfo='+JSON.stringify(item)
}) })
// this.strings = item.content .finally(() => that.isLoading = false)
// this.dialog = true },
}, openContent(item) {
} uni.navigateTo({
url: '/pages/news/rules/index?itemInfo=' + JSON.stringify(item)
})
},
} }
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
page { page {
min-height: 100%; min-height: 100%;
padding-bottom: 120upx; padding-bottom: 120upx;
} }
.help { .help {
height: 100%; height: 100%;
.helpContent { .helpContent {
margin: 20upx; margin: 20upx;
background: #fff; background: #fff;
border-radius: 20upx; border-radius: 20upx;
overflow: hidden; overflow: hidden;
padding: 20upx; padding: 20upx;
padding-bottom: 160rpx; padding-bottom: 160rpx;
.helpTitle { .helpTitle {
font-size: 32upx; font-size: 32upx;
color: #000000; color: #000000;
padding: 20upx 0; padding: 20upx 0;
font-weight: bold; font-weight: bold;
// border-bottom: 3upx solid #dfdbdb; // border-bottom: 3upx solid #dfdbdb;
} }
.helpItem { .border {
display: flex; border-bottom: 1px solid #dfdbdb;
color: #333333; }
font-size: 28upx;
border-top: 1px solid #dfdbdb;
.helpMain {
width: 180upx;
height: 180upx;
border-right: 1px solid #dfdbdb;
flex-shrink: 0;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
position: relative;
.titleIcon {
width: 50upx;
height: auto;
}
.mainText { .helpItem {
margin-top: 8upx; display: flex;
color: #333333;
font-size: 28upx;
min-height: 90rpx;
border-top: 1px solid #dfdbdb;
text { .helpMain {
color: #333333; width: 180upx;
font-size: 28upx; // height: 178upx;
margin-left: 5upx; min-height: 180rpx;
} border-right: 1px solid #dfdbdb;
} flex-shrink: 0;
display: flex;
.zhishi { justify-content: center;
position: absolute; align-items: center;
right: -5px; flex-direction: column;
background: #fff; position: relative;
top: 50%; border-bottom: 1px solid #dfdbdb;
transform: translateY(-50%);
} .titleIcon {
width: 50upx;
height: auto;
} }
.mainItem { .mainText {
display: flex; margin-top: 8upx;
flex-wrap: wrap;
align-items: center;
width: calc(100% - 90px);
.itemText {
width: 50%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-align: center;
// padding: 24upx 16upx;
height: 90upx;
line-height: 90upx;
padding: 0 10upx;
border-bottom: 1px solid #dfdbdb;
}
:first-child {
border-right: 1px solid #dfdbdb;
}
:nth-child(2n) { text {
border-left: 1px solid #dfdbdb; color: #333333;
font-size: 28upx;
margin-left: 5upx;
} }
}
:last-child { .zhishi {
border-left: 1px solid #dfdbdb; position: absolute;
} right: -5px;
background: #fff;
top: 50%;
transform: translateY(-50%);
:nth-child(3) {
border-right: 1px solid #dfdbdb;
}
} }
} }
}
.footer { .mainItem {
position: fixed;
z-index: 9;
bottom: 0;
width: 100%;
background-color: #fff;
padding: 30rpx;
.btn {
height: 100upx;
background: #FE6048;
border-radius: 28px 28px 28px 28px;
opacity: 1;
display: flex; display: flex;
align-items: center; flex-wrap: wrap;
justify-content: center; // align-items: center;
image { width: calc(100% - 90px);
width: 54upx;
height: auto;
}
text { .itemText {
font-size: 28upx; width: 50%;
font-family: PingFang SC, PingFang SC; white-space: nowrap;
font-weight: 600; overflow: hidden;
color: #FFFFFF; text-overflow: ellipsis;
margin-left: 100upx;
}
.infoBtn{
image {
width: 54upx;
height: auto;
margin-right: 100rpx;
}
text-align: center; text-align: center;
display: flex; // padding: 24upx 16upx;
justify-content: center; height: 90upx;
align-items: center; line-height: 90upx;
width: 100%; padding: 0 10upx;
height: 100%; border-bottom: 1px solid #dfdbdb;
background: #FE6048; border-left: 1px solid #dfdbdb;
border-radius: 28px 28px 28px 28px;
color: #FFFFFF;
} }
// :first-child {
// border-right: 1px solid #dfdbdb;
// }
// :nth-child(2n) {
// border-left: 1px solid #dfdbdb;
// }
// :last-child {
// border-left: 1px solid #dfdbdb;
// }
// :nth-child(3) {
// border-right: 1px solid #dfdbdb;
// }
} }
} }
} }
.dialog { .footer {
position: fixed; position: fixed;
top: 0; z-index: 9;
left: 0; bottom: 0;
width: 100%; width: 100%;
height: 100%; background-color: #fff;
display: flex; padding: 30rpx;
align-items: center;
justify-content: center; .btn {
background: rgba(0, 0, 0, 0.8); height: 100upx;
color: #fff; background: #FE6048;
border-radius: 28px 28px 28px 28px;
.content { opacity: 1;
height: 60%; display: flex;
width: 80%; align-items: center;
overflow: auto; justify-content: center;
image {
width: 54upx;
height: auto;
}
text {
font-size: 28upx;
font-family: PingFang SC, PingFang SC;
font-weight: 600;
color: #FFFFFF;
margin-left: 100upx;
}
.infoBtn {
image {
width: 54upx;
height: auto;
margin-right: 100rpx;
}
text-align: center;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
background: #FE6048;
border-radius: 28px 28px 28px 28px;
color: #FFFFFF;
}
} }
} }
}
.dialog {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.8);
color: #fff;
.content {
height: 60%;
width: 80%;
overflow: auto;
}
}
</style> </style>

@ -171,13 +171,28 @@ export default {
content: '', content: '',
success(o) { success(o) {
if (o.confirm) { if (o.confirm) {
uni.removeStorage('token'); userApi.delUser({})
uni.removeStorage('userInfo'); .then(res => {
uni.clearStorageSync() if (res.status == 200) {
uni.clearStorage() uni.showToast({
uni.reLaunch({ title: '注销成功',
url: '/pages/login/index' icon: 'none',
}) duration: 2000
})
uni.removeStorage('token');
uni.removeStorage('userInfo');
uni.clearStorageSync()
uni.clearStorage()
setTimeout(function () {
uni.reLaunch({
url: '/pages/login/index'
})
}, 2000);
}
})
.finally()
} }
} }
}); });

Loading…
Cancel
Save