Style(我的):背景图适配不同手机
This commit is contained in:
lifizer
+103
-98
@@ -6,12 +6,23 @@
|
||||
>
|
||||
<view class="my-hearder">
|
||||
<view class="my-header-bg">
|
||||
<rich-text :nodes="myHeaderBgHtml" />
|
||||
<image
|
||||
v-if="statusBarHeight <= 20"
|
||||
:src="webUrl + '/page/my/bg.png'"
|
||||
mode="widthFix"
|
||||
class="bg"
|
||||
/>
|
||||
<image
|
||||
v-else
|
||||
:src="webUrl + '/page/my/bg-big.png'"
|
||||
mode="widthFix"
|
||||
class="bg"
|
||||
/>
|
||||
</view>
|
||||
<view class="my-header-body">
|
||||
<view
|
||||
:style="{
|
||||
'padding-top': statusBarHeight
|
||||
'padding-top': statusBarHeight + 'px'
|
||||
}"
|
||||
class="title"
|
||||
>
|
||||
@@ -190,8 +201,12 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- 我的服务结束 -->
|
||||
<view v-if="bannerHtml" class="banner-wrap">
|
||||
<rich-text :nodes="bannerHtml" />
|
||||
<view v-if="bannerBgUrl" class="banner-wrap">
|
||||
<image
|
||||
:src="bannerBgUrl"
|
||||
mode="widthFix"
|
||||
class="bg"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -225,39 +240,35 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters, mapMutations} from "vuex";
|
||||
import {mapGetters, mapMutations} from "vuex"
|
||||
import {
|
||||
getSpreadImg,
|
||||
getUserInfo,
|
||||
getUserLevelInfo,
|
||||
noticeList,
|
||||
getUserCenterBanner
|
||||
} from "@/api/user";
|
||||
import {isWeixin} from "@/utils";
|
||||
import cookie from "@/utils/store/cookie";
|
||||
|
||||
const NAME = "User";
|
||||
var that;
|
||||
} from "@/api/user"
|
||||
import {isWeixin} from "@/utils"
|
||||
import cookie from "@/utils/store/cookie"
|
||||
export default {
|
||||
name: NAME,
|
||||
props: {},
|
||||
data: function () {
|
||||
name: 'UserPage',
|
||||
data() {
|
||||
return {
|
||||
statusBarHeight: uni.getSystemInfoSync().statusBarHeight + 'px',
|
||||
statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
|
||||
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||
isWeixin: false,
|
||||
isInnOwer: false,//是否是客栈主
|
||||
isInnOwer: false,// 是否是客栈主
|
||||
userLevelInfo: null,
|
||||
unreadMsgList: [],
|
||||
orderStatusNum: {
|
||||
"completeCount": 0,
|
||||
"evaluatedCount": 0,
|
||||
"orderCount": 0,
|
||||
"receivedCount": 0,
|
||||
"refundCount": 0,
|
||||
"sumPrice": 0,
|
||||
"unpaidCount": 0,
|
||||
"unshippedCount": 0
|
||||
'completeCount': 0,
|
||||
'evaluatedCount': 0,
|
||||
'orderCount': 0,
|
||||
'receivedCount': 0,
|
||||
'refundCount': 0,
|
||||
'sumPrice': 0,
|
||||
'unpaidCount': 0,
|
||||
'unshippedCount': 0
|
||||
},
|
||||
spreadPoster: {},
|
||||
toolList: [
|
||||
@@ -316,53 +327,49 @@ export default {
|
||||
allowEnter: true
|
||||
}
|
||||
],
|
||||
myHeaderBgHtml: `<img src="${this.$VUE_APP_RESOURCES_URL}/page/my/bg.png" style="diaplay: block;max-width: 100%">`,
|
||||
bannerHtml: ''
|
||||
};
|
||||
bannerBgUrl: ''
|
||||
}
|
||||
},
|
||||
computed: mapGetters(["userInfo"]),
|
||||
computed: mapGetters(['userInfo']),
|
||||
watch: {
|
||||
userInfo(newVal) {
|
||||
this.$set(this, 'orderStatusNum', newVal.orderStatusNum);
|
||||
this.$set(this, 'orderStatusNum', newVal.orderStatusNum)
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
if (this.$store.getters.token) {
|
||||
uni.showLoading({
|
||||
title: "加载中"
|
||||
});
|
||||
this.$store.dispatch("getUser", true);
|
||||
//获取用户等级信息
|
||||
this.getUserLevelInfo();
|
||||
// this.User();
|
||||
// this.MenuUser();
|
||||
this.isWeixin = isWeixin();
|
||||
this.getUnreadMsgList();
|
||||
title: '加载中'
|
||||
})
|
||||
this.$store.dispatch('getUser', true)
|
||||
// 获取用户等级信息
|
||||
this.getUserLevelInfo()
|
||||
this.isWeixin = isWeixin()
|
||||
this.getUnreadMsgList()
|
||||
} else {
|
||||
cookie.set("redirect", "/pages/user/User/index");
|
||||
|
||||
cookie.set('redirect', '/pages/user/User/index')
|
||||
uni.reLaunch({
|
||||
url: "/pages/authorization/index"
|
||||
url: '/pages/authorization/index'
|
||||
})
|
||||
}
|
||||
},
|
||||
onHide() {
|
||||
this.updateAuthorizationPage(false);
|
||||
this.updateAuthorizationPage(false)
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(["updateAuthorizationPage"]),
|
||||
...mapMutations(['updateAuthorizationPage']),
|
||||
goRoomLogs() {
|
||||
uni.navigateTo({
|
||||
url: "/pkg_common/views/roomLogs"
|
||||
url: '/pkg_common/views/roomLogs'
|
||||
})
|
||||
},
|
||||
force2Decimal(v) {
|
||||
return this.$force2Decimal(v);
|
||||
return this.$force2Decimal(v)
|
||||
},
|
||||
innTagClick() {
|
||||
// 跳转到客栈主页
|
||||
this.$yrouter.push({
|
||||
path: "/pagesInn/inn/innHome",
|
||||
path: '/pagesInn/inn/innHome',
|
||||
query: {
|
||||
id: this.userInfo.hotel.id,
|
||||
isMyInn: true
|
||||
@@ -370,105 +377,94 @@ export default {
|
||||
})
|
||||
},
|
||||
getSpreadPoster() {
|
||||
var that = this;
|
||||
const _this = this
|
||||
if (!this.spreadPoster.wap_poster) {
|
||||
uni.showLoading();
|
||||
uni.showLoading()
|
||||
getSpreadImg({}).then(res => {
|
||||
uni.hideLoading();
|
||||
that.spreadPoster = res.data[0];
|
||||
that.$refs.popup.open();
|
||||
uni.hideLoading()
|
||||
_this.spreadPoster = res.data[0]
|
||||
_this.$refs.popup.open()
|
||||
}, err => {
|
||||
uni.hideLoading();
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: err.msg || err.response.data.msg || err.response.data.message,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
})
|
||||
}
|
||||
);
|
||||
)
|
||||
} else {
|
||||
that.$refs.popup.open();
|
||||
_this.$refs.popup.open()
|
||||
}
|
||||
},
|
||||
goReturnList() {
|
||||
this.$yrouter.push("/pages/order/ReturnList/index");
|
||||
this.$yrouter.push('/pages/order/ReturnList/index')
|
||||
},
|
||||
goMyOrder(type) {
|
||||
this.$yrouter.push({
|
||||
path: "/pages/order/MyOrder/index",
|
||||
path: '/pages/order/MyOrder/index',
|
||||
query: {
|
||||
type
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
goUserAccount() {
|
||||
this.$yrouter.push({
|
||||
path: "/pages/user/UserAccount/index"
|
||||
});
|
||||
path: '/pages/user/UserAccount/index'
|
||||
})
|
||||
},
|
||||
goPersonalData() {
|
||||
this.$yrouter.push("/pkg_user/views/personalData");
|
||||
this.$yrouter.push('/pkg_user/views/personalData')
|
||||
},
|
||||
// 获取用户等级信息
|
||||
getUserLevelInfo: function () {
|
||||
var that = this;
|
||||
const _this = this
|
||||
getUserLevelInfo().then((res) => {
|
||||
if (res.data) {
|
||||
that.userLevelInfo = res.data;
|
||||
_this.userLevelInfo = res.data
|
||||
}
|
||||
uni.hideLoading();
|
||||
uni.hideLoading()
|
||||
}).catch(err => {
|
||||
uni.hideLoading();
|
||||
uni.hideLoading()
|
||||
}).finally(() => {
|
||||
uni.hideLoading();
|
||||
});
|
||||
uni.hideLoading()
|
||||
})
|
||||
// 海报
|
||||
getUserCenterBanner().then(res => {
|
||||
const { success, data } = res
|
||||
if (success) {
|
||||
if (data.userCenterBanner) {
|
||||
this.bannerHtml = `<img src="${data.userCenterBanner}" style="display: block;max-width: 100%;" />`
|
||||
this.bannerBgUrl = data.userCenterBanner
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
User: function () {
|
||||
let that = this;
|
||||
debugger
|
||||
const _this = this
|
||||
getUserInfo().then(res => {
|
||||
|
||||
if (res.data) {
|
||||
//that.user = res.data;
|
||||
that.$set(that, 'orderStatusNum', res.data.orderStatusNum);
|
||||
that.$forceUpdate();
|
||||
_this.$set(_this, 'orderStatusNum', res.data.orderStatusNum);
|
||||
_this.$forceUpdate();
|
||||
console.log('orderStatusNum:' + JSON.stringify(res.data.orderStatusNum));
|
||||
}
|
||||
|
||||
});
|
||||
})
|
||||
},
|
||||
getUnreadMsgList: function () {
|
||||
var params = {
|
||||
const _this = this;
|
||||
noticeList({
|
||||
limit: 99999,
|
||||
page: 1,
|
||||
readFlag: 'RF0'
|
||||
}
|
||||
// mescroll.endByPage(0, 0);
|
||||
// return;
|
||||
let that = this;
|
||||
noticeList(params)
|
||||
.then(res => {
|
||||
|
||||
that.unreadMsgList = res.data;
|
||||
|
||||
})
|
||||
.catch(err => {
|
||||
uni.showToast({
|
||||
title: err + '',
|
||||
icon: 'none',
|
||||
mask: false,
|
||||
duration: 1500
|
||||
});
|
||||
})
|
||||
}).then(res => {
|
||||
_this.unreadMsgList = res.data
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err + '',
|
||||
icon: 'none',
|
||||
mask: false,
|
||||
duration: 1500
|
||||
})
|
||||
})
|
||||
},
|
||||
toolItemClickHandle(item) {
|
||||
const url = item.url
|
||||
@@ -484,7 +480,7 @@ export default {
|
||||
uni.navigateTo({ url })
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
@@ -578,15 +574,23 @@ export default {
|
||||
}
|
||||
.banner-wrap {
|
||||
padding: 30rpx 0 0 0;
|
||||
.bg {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.user-page {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
overflow-x: hidden;
|
||||
.my-hearder {
|
||||
position: relative;
|
||||
.my-header-bg {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
.bg {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.my-header-body {
|
||||
position: absolute;
|
||||
@@ -606,7 +610,7 @@ export default {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 60rpx;
|
||||
padding: 50rpx 60rpx 60rpx 60rpx;
|
||||
color: #fff;
|
||||
.name-cont {
|
||||
.txt {
|
||||
@@ -643,6 +647,7 @@ export default {
|
||||
}
|
||||
.avatar-cont {
|
||||
.img {
|
||||
display: block;
|
||||
width: 78px;
|
||||
height: 78px;
|
||||
border-radius: 50%;
|
||||
|
||||
Reference in New Issue
Block a user