mirror of
http://36.133.248.69:3088/admin/RentWeAppFront.git
synced 2026-03-08 01:42:28 +08:00
完成大体功能和样式
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view class="user-center">
|
||||
<view class="user-center" :style="{backgroundImage: `url(${staticHost + bgPath1})`}">
|
||||
<customNavbar title="个人中心" ref="navbar" :is-transparent="navbarStyle.isTransparent"
|
||||
:bg-color="navbarStyle.bgColor" :text-color="navbarStyle.textColor" :opacity="navbarStyle.opacity"
|
||||
:extra-icons="navbarStyle.extraIcons" :show-home="false" :show-back="false" />
|
||||
@@ -8,174 +8,127 @@
|
||||
<u-avatar :src="avatar" size="133"></u-avatar>
|
||||
<view class="user-info">
|
||||
<view class="user-name">
|
||||
<text class="name-text">黄某某</text>
|
||||
<text class="auth-tag">未认证</text>
|
||||
<text class="name-text">{{user.userName || '用户0564'}}</text>
|
||||
<text class="auth-tag">{{user.oaAuth ? '已认证' : '未认证'}}</text>
|
||||
</view>
|
||||
<view class="user-type">用户类型：组织</view>
|
||||
<view class="user-type">用户类型：{{user.userType ==='0' ? '个人' : '组织'}}</view>
|
||||
</view>
|
||||
<view class="msg-setting">
|
||||
<view class="u-relative" @click="toMessage()">
|
||||
<view class="u-relative msg-icon" @click="toMessage()">
|
||||
<u-icon name="chat" size="48" color="#333"></u-icon>
|
||||
<view v-if="unreadMsgCount > 0" class="badge">
|
||||
{{ unreadMsgCount > 99 ? '99+' : unreadMsgCount }}
|
||||
</view>
|
||||
</view>
|
||||
<u-icon name="setting" size="48" color="#333" @click="toSetting()"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="contract-view">
|
||||
<view class="contract-view" :style="{backgroundImage: `url(${staticHost + bgPath2})`}">
|
||||
<!-- 我的合同和我的预约 -->
|
||||
<view class="contract-appointment">
|
||||
<view class="card" @click="clickNav('pages/center/contract')">
|
||||
<view class="card" @click="clickNav('/pages-biz/contract/contract')">
|
||||
<view class="card-title">我的合同</view>
|
||||
<view class="card-main">
|
||||
<view class="card-content">
|
||||
<view class="card-number">5</view>
|
||||
<view class="card-type">份合同</view>
|
||||
<view class="card-number">{{unsignContractNum}}</view>
|
||||
<view class="card-type">份待签署合同</view>
|
||||
</view>
|
||||
<view class="card-icon">
|
||||
<image src="/static/icon/sign.png" mode="widthFix"></image>
|
||||
<image :src="staticHost + '/public' + '/static/icon/sign.png'" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card" @click="clickNav('pages/reserve/reserveRecords')">
|
||||
<view class="card" @click="clickNav('/pages-biz/reserve/reserveRecords')">
|
||||
<view class="card-title">我的预约</view>
|
||||
<view class="card-main">
|
||||
<view class="card-content">
|
||||
<view class="card-number">3</view>
|
||||
<view class="card-type">个预约</view>
|
||||
<view class="card-number">{{handlingReserveNum}}</view>
|
||||
<view class="card-type">个预约中</view>
|
||||
</view>
|
||||
<view class="card-icon">
|
||||
<image src="/static/icon/sign.png" mode="widthFix"></image>
|
||||
<image :src="staticHost + '/public' + '/static/icon/sign.png'" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 我的服务 -->
|
||||
<!-- 订单信息 -->
|
||||
<view class="my-service">
|
||||
<view class="service-title">我的服务</view>
|
||||
<view class="service-title">订单信息</view>
|
||||
<view class="service-list">
|
||||
<view class="service-item" @click="clickNav('pages/bill/bill')">
|
||||
<view class="service-item" @click="clickNav('/pages-biz/bill/payHistory')">
|
||||
<view class="service-icon">
|
||||
<image src="/static/icon/账单.png"></image>
|
||||
<image :src="staticHost + '/public' + '/static/icon/bill.png'"></image>
|
||||
</view>
|
||||
<view class="service-name">账单</view>
|
||||
</view>
|
||||
<view class="service-item" @click="clickNav('pages/center/myLease')">
|
||||
<view class="service-item" @click="clickNav('/pages-biz/myrent/myLease')">
|
||||
<view class="service-icon">
|
||||
<image src="/static/icon/租赁资产.png"></image>
|
||||
<image :src="staticHost + '/public' + '/static/icon/myrent.png'"></image>
|
||||
</view>
|
||||
<view class="service-name">租赁资产</view>
|
||||
</view>
|
||||
<view class="service-item" @click="clickNav('pages/wae/wae')">
|
||||
<view class="service-icon">
|
||||
<image src="/static/icon/水电费.png"></image>
|
||||
<view class="service-item" @click="clickNav('/pages-biz/wae/wae')">
|
||||
<view class="service-icon badge-wrapper">
|
||||
<image :src="staticHost + '/public' + '/static/icon/wae.png'"></image>
|
||||
<view v-if="unpaidWaeCount > 0" class="badge">
|
||||
{{ unpaidWaeCount > 99 ? '99+' : unpaidWaeCount }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="service-name">水电缴费</view>
|
||||
<view class="service-name">水电费待付</view>
|
||||
</view>
|
||||
<view class="service-item" @click="clickNav('pages/unpaid/unpaid')">
|
||||
<view class="service-icon">
|
||||
<image src="/static/icon/待付款.png"></image>
|
||||
<view class="service-item" @click="clickNav('/pages-biz/unpaid/unpaid')">
|
||||
<view class="service-icon badge-wrapper">
|
||||
<image :src="staticHost + '/public' + '/static/icon/unpaid.png'"></image>
|
||||
<view v-if="unpaidRentCount > 0" class="badge">
|
||||
{{ unpaidRentCount > 99 ? '99+' : unpaidRentCount }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="service-name">待付</view>
|
||||
<view class="service-name">租金待付</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 常用工具 -->
|
||||
<!-- 辅助工具 -->
|
||||
<view class="common-tools">
|
||||
<view class="tools-title">常用工具</view>
|
||||
<view class="tools-title">辅助工具</view>
|
||||
<view class="tools-list">
|
||||
<view class="tool-item" @click="clickNav('pages/message/guestbook')">
|
||||
<view class="tool-item" @click="clickNav('/pages-assets/fallback/fallback')">
|
||||
<view class="tool-icon">
|
||||
<image src="/static/icon/留言纸.png" mode="widthFix"></image>
|
||||
<image :src="staticHost + '/public' + '/static/icon/fallback.png'" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="tool-name">留言板</view>
|
||||
</view>
|
||||
<view class="tool-item" @click="clickNav('pages/bill/payHistory')">
|
||||
<!-- 新增计算器 -->
|
||||
<view class="tool-item" @click="clickNav('/pages-biz/tool/calculator')">
|
||||
<view class="tool-icon">
|
||||
<image src="/static/icon/账本.png" mode="widthFix"></image>
|
||||
<image :src="staticHost + '/public/static/icon/calculator.png'" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="tool-name">计算器</view>
|
||||
</view>
|
||||
<view class="tool-name">缴费记录</view>
|
||||
</view>
|
||||
<view class="tool-item" @click="clickNav('pages/wae/waeRecords')">
|
||||
<view class="tool-icon">
|
||||
<image src="/static/icon/书签.png" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="tool-name">水电费明细</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import UCellItemPlus from "../../components/ucellitem/UCellItemPlus.vue";
|
||||
import config from "@/common/config.js";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
UCellItemPlus
|
||||
},
|
||||
|
||||
data() {
|
||||
const life = uni.getStorageSync('lifeData') || {}
|
||||
const user = (life.vuex_user && life.vuex_user.user) || {}
|
||||
|
||||
return {
|
||||
user, // user 信息放这里即可
|
||||
show: true,
|
||||
showGetProfile: false,
|
||||
userType: '',
|
||||
oaAuth: '',
|
||||
gridList: [{
|
||||
name: "我的合同",
|
||||
icon: "/static/icon/sign.png",
|
||||
url: "pages/center/history"
|
||||
},
|
||||
{
|
||||
name: "我的账单",
|
||||
icon: "../../static/icon/账单.png",
|
||||
url: "pages/bill/bill"
|
||||
},
|
||||
{
|
||||
name: "我的待付",
|
||||
icon: "../../static/icon/待付款.png",
|
||||
url: "pages/unpaid/unpaid"
|
||||
},
|
||||
{
|
||||
name: "水电缴费",
|
||||
icon: "../../static/icon/水电费.png",
|
||||
url: "pages/wae/wae"
|
||||
}
|
||||
],
|
||||
cellList: [{
|
||||
name: "我的租赁资产",
|
||||
icon: "/static/icon/住房C.png",
|
||||
url: "pages/center/myLease"
|
||||
},
|
||||
{
|
||||
name: "我的预约",
|
||||
icon: "/static/icon/预约.png",
|
||||
url: "pages/reserve/reserveRecords"
|
||||
},
|
||||
{
|
||||
name: "缴费记录",
|
||||
icon: "/static/icon/账本.png",
|
||||
url: "pages/bill/payHistory"
|
||||
},
|
||||
{
|
||||
name: "水电费明细",
|
||||
icon: "/static/icon/书签.png",
|
||||
url: "pages/wae/waeRecords"
|
||||
},
|
||||
{
|
||||
name: "留言板",
|
||||
icon: "/static/icon/留言纸.png",
|
||||
url: "pages/wae/waeRecords"
|
||||
}
|
||||
],
|
||||
user:{},
|
||||
bgPath1: '/public/static/center/my-bg.png',
|
||||
bgPath2: '/public/static/center/my-bg2.png',
|
||||
unsignContractNum:0,
|
||||
handlingReserveNum:0,
|
||||
// 导航栏样式控制
|
||||
unreadMsgCount: 0, // 未读消息
|
||||
unpaidWaeCount: 0, // 水电费待付
|
||||
unpaidRentCount: 0, // 租金待付
|
||||
navbarStyle: {
|
||||
isTransparent: true,
|
||||
bgColor: '#ffffff',
|
||||
@@ -197,13 +150,18 @@
|
||||
return raw.includes(config.staticUrl) ?
|
||||
raw :
|
||||
config.staticUrl + raw
|
||||
},
|
||||
staticHost() {
|
||||
return this.$config.staticUrl
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
onLoad() {
|
||||
uni.$on('updateAvatar', () => {
|
||||
this.updateAvatar();
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
onUnload() {
|
||||
@@ -211,23 +169,31 @@
|
||||
},
|
||||
|
||||
onShow() {
|
||||
// this.checkToken();
|
||||
|
||||
this.$checkToken(this.$getToken())
|
||||
this.loadUserInfo()
|
||||
this.countHandlingReserve()
|
||||
this.countUnHandleContract()
|
||||
|
||||
|
||||
},
|
||||
|
||||
methods: {
|
||||
loadUserInfo(){
|
||||
this.user = uni.getStorageSync('userInfo');
|
||||
},
|
||||
logout() {
|
||||
this.$u.vuex('vuex_token', '');
|
||||
this.$u.vuex('vuex_user', {});
|
||||
this.$u.route('/pages/login/login')
|
||||
this.$u.route('/pages/login/login');
|
||||
uni.removeStorageSync('userInfo');
|
||||
},
|
||||
|
||||
toMessage() {
|
||||
this.$u.route('/pages/message/message')
|
||||
this.$u.route('/pages-biz/message/message')
|
||||
},
|
||||
|
||||
toSetting() {
|
||||
this.$u.route('/pages/profile/setting')
|
||||
this.$u.route('/pages-biz/profile/setting')
|
||||
},
|
||||
|
||||
callPhoneNumber() {
|
||||
@@ -235,39 +201,11 @@
|
||||
phoneNumber: "18720989281"
|
||||
});
|
||||
},
|
||||
|
||||
aboutMe() {
|
||||
this.$u.route('/pages/profile/aboutMe')
|
||||
},
|
||||
|
||||
toMyLease() {
|
||||
this.$u.route('/pages/center/myLease')
|
||||
},
|
||||
checkToken() {
|
||||
let lifeData = uni.getStorageSync('lifeData');
|
||||
let token = lifeData.vuex_token
|
||||
if (!token || token === null || token === undefined ||
|
||||
(typeof token === 'object' && Object.keys(token).length === 0)) {
|
||||
console.log("登录态不存在")
|
||||
return uni.reLaunch({
|
||||
url: '../login/login'
|
||||
})
|
||||
}
|
||||
let url = "/login/checkExpiration";
|
||||
this.$u.get(url, {}, {
|
||||
'WT': token
|
||||
}).then(obj => {
|
||||
if (obj.data) {
|
||||
uni.reLaunch({
|
||||
url: '../login/login'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
clickNav(url) {
|
||||
if (url) {
|
||||
this.$u.route(url);
|
||||
this.$u.route({
|
||||
url
|
||||
});
|
||||
} else {
|
||||
this.$mytip.toast('敬请期待')
|
||||
}
|
||||
@@ -277,48 +215,50 @@
|
||||
// 触发 computed 自动更新
|
||||
this.$forceUpdate()
|
||||
},
|
||||
// 进入个人中心时判断是否需要补充资料
|
||||
checkNeedProfile() {
|
||||
let life = uni.getStorageSync('lifeData') || {}
|
||||
let user = life.vuex_user
|
||||
let token = life.vuex_token
|
||||
if (!token) return; // 未登录不弹窗
|
||||
// 没有头像或昵称才弹窗
|
||||
if (!user || !user.avatarUrl || !user.nickName) {
|
||||
this.showGetProfile = true;
|
||||
}
|
||||
},
|
||||
getWxProfile() {
|
||||
uni.getUserProfile({
|
||||
desc: "用于完善个人资料展示",
|
||||
success: res => {
|
||||
const userInfo = res.userInfo;
|
||||
// 存储
|
||||
this.$u.vuex('vuex_user', userInfo);
|
||||
|
||||
// 也可同步调用后端更新头像昵称
|
||||
// this.$u.post('/user/updateWxInfo', userInfo);
|
||||
|
||||
this.showGetProfile = false;
|
||||
},
|
||||
fail: () => {
|
||||
uni.showToast({
|
||||
title: "授权失败",
|
||||
icon: "none"
|
||||
});
|
||||
countUnHandleContract(){
|
||||
this.$u.get(`/contract/countUnsign`, {},{
|
||||
WT: this.$getToken()
|
||||
}).then(res => {
|
||||
if(res.flag){
|
||||
this.unsignContractNum = res.data
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
getUserOtherInfo() {
|
||||
let life = uni.getStorageSync('lifeData') || {}
|
||||
let token = life.vuex_token
|
||||
let url = "/login/userOtherInfo";
|
||||
this.$u.get(url, {}, {
|
||||
'WT': token
|
||||
}).then(obj => {
|
||||
this.userType = obj.data.userType;
|
||||
this.oaAuth = obj.data.oaAuth;
|
||||
});
|
||||
countHandlingReserve(){
|
||||
this.$u.get(`/reservate/countHandling`, {},{
|
||||
WT: this.$getToken()
|
||||
}).then(res => {
|
||||
if(res.flag){
|
||||
this.handlingReserveNum = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
countUnreadMsg(){
|
||||
this.$u.get(`/messsage/countUnread`, {},{
|
||||
WT: this.$getToken()
|
||||
}).then(res => {
|
||||
if(res.flag){
|
||||
this.unreadMsgCount = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
countUnpayRentBills(){
|
||||
this.$u.get(`/bill/countUnpayRentBills`, {},{
|
||||
WT: this.$getToken()
|
||||
}).then(res => {
|
||||
if(res.flag){
|
||||
this.unpaidRentCount = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
countUnpayWaeBills(){
|
||||
this.$u.get(`/bill/countUnpayWaeBills`, {},{
|
||||
WT: this.$getToken()
|
||||
}).then(res => {
|
||||
if(res.flag){
|
||||
this.unpaidWaeCount = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -326,8 +266,7 @@
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.user-center {
|
||||
padding-top: 120rpx;
|
||||
background-image: url("https://eyidu.ydszw.cn/static/img/test/my-bg.png");//只支持网络图片，请自行上传至图片服务器并替换
|
||||
padding-top: 175rpx;
|
||||
background-color: #fff;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 750rpx 731rpx;
|
||||
@@ -379,7 +318,6 @@
|
||||
.contract-view {
|
||||
width: 96%;
|
||||
margin: 0 auto;
|
||||
background-image: url("https://eyidu.ydszw.cn/static/img/test/my-bg2.png"); //只支持网络图片，请自行上传至图片服务器并替换
|
||||
background-repeat: round;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
@@ -520,5 +458,38 @@
|
||||
.tool-name {
|
||||
font-size: 24rpx;
|
||||
color: #222222;
|
||||
|
||||
}
|
||||
.badge-wrapper {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 80rpx; // 对应 image 尺寸
|
||||
height: 70rpx; // 对应 image 尺寸
|
||||
}
|
||||
/* 红点角标 */
|
||||
.badge {
|
||||
position: absolute;
|
||||
top: -10rpx;
|
||||
right: -14rpx;
|
||||
min-width: 32rpx;
|
||||
height: 32rpx;
|
||||
padding: 0 8rpx;
|
||||
|
||||
background-color: #ff3b30;
|
||||
color: #fff;
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
|
||||
border-radius: 16rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 消息图标特殊一点 */
|
||||
.msg-icon {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
@@ -1,187 +0,0 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-navbar :is-back="false" title="我的" :border-bottom="false"></u-navbar>
|
||||
<view class="u-flex user-box u-p-l-30 u-p-r-20 u-p-t-30 u-p-b-30">
|
||||
<view class="u-flex" @click="profile">
|
||||
<view class="u-m-r-20">
|
||||
<u-avatar :src="avatar" size="140"></u-avatar>
|
||||
</view>
|
||||
<view class="u-flex-1">
|
||||
<view class="u-font-18 u-p-b-20">{{vuex_user.user.userName}}</view>
|
||||
<view class="u-font-14 u-tips-color">昵称:{{vuex_user.user.nickName}}</view>
|
||||
<view class="u-font-14 u-tips-color">用户类型:个人</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="center-nav">
|
||||
<u-row>
|
||||
<u-col span="3" text-align="center" v-for="(item,index) in navList" :key="index">
|
||||
<view v-if="item.name=='问题反馈'">
|
||||
<!-- 调用微信反馈功能 -->
|
||||
<button type="default" open-type="feedback" class="clearBtn" hover-class="none" style="background-color: #FFFFFF;">
|
||||
<u-icon :name="item.icon" color="#909399" size="50"></u-icon>
|
||||
<view class="tabName" style="padding-top: 15rpx;">{{item.name}}</view>
|
||||
</button>
|
||||
</view>
|
||||
<view @click="clickNav(item.url)" v-else>
|
||||
<u-icon :name="item.icon" color="#909399" size="50"></u-icon>
|
||||
<view class="tabName">{{item.name}}</view>
|
||||
</view>
|
||||
</u-col>
|
||||
</u-row>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-20">
|
||||
<u-cell-group>
|
||||
<!-- <u-cell-item icon="integral" title="实名认证" @click="setting"></u-cell-item> -->
|
||||
<u-cell-item icon="setting" title="个人中心" @click="setting"></u-cell-item>
|
||||
</u-cell-group>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-20">
|
||||
<u-cell-group>
|
||||
<u-cell-item icon="level" :arrow="false" title="技术支持" value="18720989281" @click="callPhoneNumber"></u-cell-item>
|
||||
<u-cell-item icon="question-circle" title="常见问题" @click="problem"></u-cell-item>
|
||||
<u-cell-item icon="star" title="关于我们" @click="aboutMe"></u-cell-item>
|
||||
</u-cell-group>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import config from "@/common/config.js" // 全局配置文件
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
avatar:uni.getStorageSync('lifeData').vuex_user.user.avatar.includes(config.staticUrl)?uni.getStorageSync('lifeData').vuex_user.user.avatar:config.staticUrl+uni.getStorageSync('lifeData').vuex_user.user.avatar,
|
||||
show:true,
|
||||
navList:[
|
||||
{name:"我的合同",icon:"checkmark-circle",url:"pages/center/history"},
|
||||
{name:"我的账单",icon:"heart",url:"pages/center/heart"},
|
||||
{name:"消息通知",icon:"order",url:"pages/center/order"},
|
||||
{name:"水电充值",icon:"info-circle"}
|
||||
],
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
uni.$on('updateAvatar', (obj) => {
|
||||
// 获取数据
|
||||
this.updateAvatar();
|
||||
})
|
||||
},
|
||||
onUnload() {
|
||||
// 移除监听事件
|
||||
uni.$off('updateAvatar');
|
||||
},
|
||||
onShow(){
|
||||
// 检查token
|
||||
this.checkToken();
|
||||
},
|
||||
methods: {
|
||||
logout() {
|
||||
// 登录成功修改token与用户信息
|
||||
this.$u.vuex('vuex_token', '');
|
||||
this.$u.vuex('vuex_user', {});
|
||||
this.$u.route('/pages/login/login')
|
||||
},
|
||||
profile(){
|
||||
this.$u.route('/pages/profile/profile')
|
||||
},
|
||||
setting(){
|
||||
this.$u.route('/pages/profile/setting')
|
||||
},
|
||||
//拨打固定电话
|
||||
callPhoneNumber() {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: "18720989281",
|
||||
});
|
||||
},
|
||||
problem(){
|
||||
this.$u.route({
|
||||
url: 'pages/login/problem'
|
||||
})
|
||||
},
|
||||
// 关于作者
|
||||
aboutMe() {
|
||||
this.$u.route('/pages/profile/aboutMe')
|
||||
},
|
||||
checkToken(){
|
||||
// 判断是否有token
|
||||
let lifeData = uni.getStorageSync('lifeData');
|
||||
let token = lifeData.vuex_token
|
||||
if(!token){
|
||||
// 没有token 则跳转到登录
|
||||
return uni.reLaunch({
|
||||
url:'../login/login'
|
||||
})
|
||||
}else{
|
||||
// 判断Token是否有效
|
||||
let url = "/api/profile/isExpiration";
|
||||
this.$u.get(url,{
|
||||
token:token
|
||||
}).then(obj => {
|
||||
if(obj.data){
|
||||
// 没有token过期则跳转到登录
|
||||
return uni.reLaunch({
|
||||
url:'../login/login'
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
code(){
|
||||
this.$mytip.toast('敬请期待')
|
||||
},
|
||||
clickNav(url){
|
||||
if(url){
|
||||
this.$u.route(url);
|
||||
}else{
|
||||
this.$mytip.toast('敬请期待')
|
||||
}
|
||||
},
|
||||
updateAvatar(){
|
||||
this.avatar = uni.getStorageSync('lifeData').vuex_user.user.avatar.includes(config.staticUrl)?uni.getStorageSync('lifeData').vuex_user.user.avatar:config.staticUrl+uni.getStorageSync('lifeData').vuex_user.user.avatar
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.user-box{
|
||||
background-color: #fff;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.center-nav{
|
||||
background-color: #FFFFFF;
|
||||
margin-top: 30rpx;
|
||||
padding: 30rpx 0;
|
||||
border-radius: 8px;
|
||||
.tabName{
|
||||
color: #606266;
|
||||
font-size: 26rpx;
|
||||
padding-top: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.qiandao{
|
||||
color: #606266;
|
||||
font-size: 24rpx;
|
||||
margin-right: 24rpx;
|
||||
margin-top: 54rpx;
|
||||
justify-content:center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.clearBtn{
|
||||
margin:0;
|
||||
padding: 0;
|
||||
line-height: 1;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.clearBtn::after{
|
||||
position: unset !important;
|
||||
border: unset;
|
||||
}
|
||||
</style>
|
||||
@@ -1,329 +0,0 @@
|
||||
<template>
|
||||
|
||||
<view class="contract-page">
|
||||
<!-- 顶部导航栏 -->
|
||||
<customNavbar title="我的合同" />
|
||||
|
||||
<!-- Tabs -->
|
||||
<view class="tab-wrapper">
|
||||
<u-tabs :list="tabList" :current="currentTab" @change="onTabChange" lineColor="#EA4D3E" activeColor="#EA4D3E"
|
||||
itemStyle="padding: 0 30rpx;"></u-tabs>
|
||||
</view>
|
||||
|
||||
<DateFilter :start="startDate" :end="endDate" @update:start="startDate = $event" @update:end="endDate = $event"
|
||||
@change="onDateFilterChange" />
|
||||
|
||||
<!-- 合同列表 -->
|
||||
<scroll-view scroll-y class="scroll-content" @scrolltolower="loadMore" :refresher-enabled="true"
|
||||
:refresher-triggered="isRefreshing" @refresherrefresh="refresh">
|
||||
<view v-if="contracts.length > 0" class="contract-list">
|
||||
<view class="contract-card" v-for="item in contracts" :key="item.id" @click="goDetail(item)">
|
||||
<image class="contract-cover" :src="item.coverUrl || defaultCover" mode="aspectFill" />
|
||||
|
||||
<view class="contract-info">
|
||||
<view class="top-row">
|
||||
<text class="asset-name">{{ item.assetName }}</text>
|
||||
<u-icon name="arrow-right" size="28" color="#ccc" />
|
||||
</view>
|
||||
<view class="asset-room">{{ item.assetRoom || "—" }}</view>
|
||||
<view class="date-range">{{ item.startDate }} ~ {{ item.endDate }}</view>
|
||||
|
||||
<view :class="['status-tag', item.status]">
|
||||
{{ getStatusText(item.status) }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<u-loadmore :status="loadStatus" />
|
||||
</view>
|
||||
|
||||
<view v-else class="empty">
|
||||
<u-empty mode="list" text="暂无合同记录" />
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
import DateFilter from '../../components/DatePicker/DateFilter.vue';
|
||||
export default {
|
||||
components: { DateFilter },
|
||||
data() {
|
||||
return {
|
||||
tabList: [{
|
||||
name: "全部",
|
||||
value: "all"
|
||||
},
|
||||
{
|
||||
name: "待签署",
|
||||
value: "pending"
|
||||
},
|
||||
{
|
||||
name: "已签署",
|
||||
value: "signed"
|
||||
},
|
||||
{
|
||||
name: "已过期",
|
||||
value: "expired"
|
||||
},
|
||||
],
|
||||
|
||||
currentTab: 0,
|
||||
statusFilter: "all",
|
||||
|
||||
// --- 时间筛选 ---
|
||||
startDate: "",
|
||||
endDate: "",
|
||||
// 可选：限制日期范围
|
||||
minDate: "2000-01-01",
|
||||
maxDate: "2099-12-31",
|
||||
contracts: [],
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
loadStatus: "loadmore",
|
||||
isRefreshing: false,
|
||||
defaultCover: "/static/img/index/swiper/swiper3.jpg",
|
||||
};
|
||||
},
|
||||
|
||||
onLoad() {
|
||||
this.loadContracts(true);
|
||||
},
|
||||
|
||||
methods: {
|
||||
onTabChange(index) {
|
||||
this.currentTab = index;
|
||||
this.statusFilter = this.tabList[index].value;
|
||||
this.resetAndLoad();
|
||||
},
|
||||
onDateFilterChange({ start, end }) {
|
||||
this.resetAndLoad();
|
||||
},
|
||||
|
||||
formatDate(time) {
|
||||
const d = new Date(time);
|
||||
const m = String(d.getMonth() + 1).padStart(2, "0");
|
||||
const day = String(d.getDate()).padStart(2, "0");
|
||||
return `${d.getFullYear()}-${m}-${day}`;
|
||||
},
|
||||
|
||||
resetAndLoad() {
|
||||
this.pageNo = 1;
|
||||
this.contracts = [];
|
||||
this.loadStatus = "loading";
|
||||
this.loadContracts(true);
|
||||
},
|
||||
|
||||
/** 你的 loadContracts() 保持不变，只需加：按时间筛选 */
|
||||
loadContracts(isInit = false) {
|
||||
this.loadStatus = "loading";
|
||||
|
||||
setTimeout(() => {
|
||||
let mockAll = [{
|
||||
id: 1,
|
||||
assetName: '金辉大厦',
|
||||
assetRoom: '502',
|
||||
coverUrl: '',
|
||||
status: 'pending',
|
||||
startDate: '2025-01-01',
|
||||
endDate: '2025-12-31'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
assetName: '东方广场',
|
||||
assetRoom: '',
|
||||
status: 'signed',
|
||||
startDate: '2024-03-01',
|
||||
endDate: '2025-03-01'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
assetName: '海景公寓',
|
||||
assetRoom: 'A-1201',
|
||||
status: 'expired',
|
||||
startDate: '2023-01-01',
|
||||
endDate: '2024-01-01'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
assetName: '富力中心',
|
||||
assetRoom: '1699',
|
||||
status: 'pending',
|
||||
startDate: '2024-10-01',
|
||||
endDate: '2025-10-01'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
assetName: '财富大厦',
|
||||
assetRoom: '2308',
|
||||
status: 'signed',
|
||||
startDate: '2023-06-01',
|
||||
endDate: '2024-06-01'
|
||||
}
|
||||
];
|
||||
|
||||
// 状态过滤
|
||||
if (this.statusFilter !== "all") {
|
||||
mockAll = mockAll.filter(i => i.status === this.statusFilter);
|
||||
}
|
||||
|
||||
// 时间过滤
|
||||
if (this.startDate) mockAll = mockAll.filter(i => i.startDate >= this.startDate);
|
||||
if (this.endDate) mockAll = mockAll.filter(i => i.endDate <= this.endDate);
|
||||
|
||||
// 分页
|
||||
this.total = mockAll.length;
|
||||
const start = (this.pageNo - 1) * this.pageSize;
|
||||
const pageList = mockAll.slice(start, start + this.pageSize);
|
||||
|
||||
if (this.pageNo === 1) {
|
||||
this.contracts = pageList;
|
||||
} else {
|
||||
this.contracts = [...this.contracts, ...pageList];
|
||||
}
|
||||
|
||||
this.loadStatus = this.contracts.length >= this.total ? "nomore" : "loadmore";
|
||||
this.isRefreshing = false;
|
||||
}, 400);
|
||||
},
|
||||
|
||||
refresh() {
|
||||
this.isRefreshing = true;
|
||||
this.resetAndLoad();
|
||||
},
|
||||
|
||||
loadMore() {
|
||||
if (this.loadStatus !== "loadmore") return;
|
||||
this.pageNo++;
|
||||
this.loadContracts();
|
||||
},
|
||||
|
||||
goDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/detail/contractDetail?id=${item.id}`,
|
||||
});
|
||||
},
|
||||
|
||||
getStatusText(status) {
|
||||
switch (status) {
|
||||
case "pending":
|
||||
return "待签署";
|
||||
case "signed":
|
||||
return "已签署";
|
||||
case "expired":
|
||||
return "已过期";
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.contract-page {
|
||||
background-color: #f8f8f8;
|
||||
padding-top: 120rpx;
|
||||
/* 给导航栏留空间 */
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.scroll-content {
|
||||
height: calc(100vh - 100rpx);
|
||||
}
|
||||
|
||||
.contract-list {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.contract-card {
|
||||
display: flex;
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
margin-bottom: 24rpx;
|
||||
padding: 20rpx;
|
||||
box-shadow: 0 4rpx 8rpx rgba(0, 0, 0, 0.05);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.contract-cover {
|
||||
width: 193rpx;
|
||||
height: 145rpx;
|
||||
border-radius: 10rpx;
|
||||
background-color: #FCE5E0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.contract-info {
|
||||
flex: 1;
|
||||
margin-left: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.top-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.asset-name {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.asset-room {
|
||||
font-size: 26rpx;
|
||||
color: #555;
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
|
||||
.date-range {
|
||||
font-size: 24rpx;
|
||||
color: #888;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.status-tag {
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
right: 0rpx;
|
||||
padding: 12rpx 15rpx;
|
||||
border-radius: 6rpx;
|
||||
font-size: 26rpx;
|
||||
|
||||
&.pending {
|
||||
background: #FEEDDD;
|
||||
color: #EFA049;
|
||||
}
|
||||
|
||||
&.signed {
|
||||
background: #FCE5E0;
|
||||
color: #ED7748;
|
||||
}
|
||||
|
||||
&.expired {
|
||||
background: #CDCDCD;
|
||||
color: #969696;
|
||||
}
|
||||
}
|
||||
|
||||
.empty {
|
||||
margin-top: 200rpx;
|
||||
}
|
||||
|
||||
.tab-wrapper {
|
||||
background-color: #ffffff;
|
||||
padding: 10rpx 0;
|
||||
box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.06);
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
</style>
|
||||
@@ -1,292 +0,0 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-navbar :is-back="true" title="收藏" :border-bottom="false"></u-navbar>
|
||||
<view class="wrap">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
||||
<view class="page-box">
|
||||
<view v-if="heartList.length === 0">
|
||||
<view class="centre">
|
||||
<image :src="empty" mode=""></image>
|
||||
<view class="explain">
|
||||
您还没有收藏的房源
|
||||
<view class="tips">可以去逛逛</view>
|
||||
</view>
|
||||
<view class="btn" @click="goHome">首页</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else
|
||||
class="order" v-for="(item, index) in heartList" :key="index"
|
||||
@click="viewImage(item.id)">
|
||||
<view class="top">
|
||||
<view class="left">
|
||||
<view class="store">{{ item.code }}</view>
|
||||
<u-icon name="arrow-right" color="rgb(203,203,203)" :size="26"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="left"><image :src="item.image" mode="aspectFill"></image></view>
|
||||
<view class="content">
|
||||
<view class="title u-line-2">
|
||||
{{item.villageName}} {{item.type == '整租' ? item.houseNum + item.houseHall + item.toiletNum : item.roomType}}
|
||||
</view>
|
||||
<view class="price">¥{{item.price}}</view>
|
||||
<view class="type">
|
||||
{{item.type}} | {{item.type == '整租' ? item.houseArea : item.roomArea}}㎡ | {{item.decoration}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="evaluate btn" @click="viewImage(item.id)">查看</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import config from "@/common/config.js" // 全局配置文件
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
empty:'/static/empty/default.png',
|
||||
heartList: [],
|
||||
pageNum: 1,
|
||||
pageSize: 100,
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.findHeartList();
|
||||
},
|
||||
methods: {
|
||||
findHeartList() {
|
||||
let url = "/api/houseApi/findHouseHeartList";
|
||||
let lifeData = uni.getStorageSync('lifeData');
|
||||
let vuex_user = lifeData.vuex_user
|
||||
this.$u.get(url,{
|
||||
userId:vuex_user.user.userId,
|
||||
pageNum: this.pageNum,
|
||||
pageSize: this.pageSize,
|
||||
orderByColumn: 'update_time,create_time',
|
||||
isAsc: 'desc'
|
||||
}
|
||||
).then(result => {
|
||||
const data = result.rows;
|
||||
this.houseList = data;
|
||||
for (let i = 0; i < this.houseList.length; i++) {
|
||||
// 先转成字符串再转成对象，避免数组对象引用导致数据混乱
|
||||
let item = this.houseList[i]
|
||||
if(!item.faceUrl.includes(config.staticUrl)){
|
||||
item.image = config.staticUrl+item.faceUrl
|
||||
}else{
|
||||
item.image = item.faceUrl
|
||||
}
|
||||
if(item.type == 0){
|
||||
item.type = '整租'
|
||||
}else if(item.type == 1){
|
||||
item.type = '合租'
|
||||
}
|
||||
if(item.roomType == 1){
|
||||
item.roomType = '主卧'
|
||||
}else if(item.roomType == 2){
|
||||
item.roomType = '次卧'
|
||||
}else{
|
||||
item.roomType = '未知'
|
||||
}
|
||||
if(this.$u.test.isEmpty(item.houseNum)){
|
||||
item.houseNum = ''
|
||||
}
|
||||
if(this.$u.test.isEmpty(item.houseHall)){
|
||||
item.houseHall = ''
|
||||
}
|
||||
if(this.$u.test.isEmpty(item.toiletNum)){
|
||||
item.toiletNum = ''
|
||||
}
|
||||
this.heartList.push(item);
|
||||
}
|
||||
});
|
||||
},
|
||||
goHome(){
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
})
|
||||
},
|
||||
viewImage(houseId){
|
||||
this.$u.route({
|
||||
url: '/pages/detail/detail',
|
||||
params: {
|
||||
houseId: houseId
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* #ifndef H5 */
|
||||
page {
|
||||
height: 100%;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
/* #endif */
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
.empty{
|
||||
overflow: hidden;
|
||||
.tip{
|
||||
color: #909399 ;
|
||||
}
|
||||
.btn {
|
||||
color:#fff ;
|
||||
background-color: #2979ff;
|
||||
width:200rpx;
|
||||
padding: 15rpx 28rpx;
|
||||
border-radius: 130rpx;
|
||||
margin: 30rpx 0 0 100rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.order {
|
||||
width: 710rpx;
|
||||
background-color: #ffffff;
|
||||
margin: 20rpx auto;
|
||||
border-radius: 20rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.store {
|
||||
// margin: 0 10rpx;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
.right {
|
||||
color: #2979ff;
|
||||
}
|
||||
}
|
||||
.item {
|
||||
display: flex;
|
||||
margin: 20rpx 0 0 0;
|
||||
.left {
|
||||
margin-right: 30rpx;
|
||||
image {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
.title {
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
.price{
|
||||
margin: 10rpx 0;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.type {
|
||||
margin: 10rpx 0;
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
}
|
||||
.desc {
|
||||
margin: 10rpx 0;
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bottom {
|
||||
display: flex;
|
||||
margin-top: 20rpx;
|
||||
padding: 0 10rpx;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
.btn {
|
||||
margin-left: 20rpx;
|
||||
line-height: 52rpx;
|
||||
width: 160rpx;
|
||||
border-radius: 26rpx;
|
||||
border: 2rpx solid $u-border-color;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
color: $u-type-info-dark;
|
||||
}
|
||||
.evaluate {
|
||||
color: $u-tips-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
.centre {
|
||||
text-align: center;
|
||||
margin: 200rpx auto;
|
||||
font-size: 32rpx;
|
||||
image {
|
||||
width: 164rpx;
|
||||
height: 164rpx;
|
||||
border-radius: 50%;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.tips {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.btn {
|
||||
margin: 80rpx auto;
|
||||
width: 200rpx;
|
||||
border-radius: 32rpx;
|
||||
line-height: 64rpx;
|
||||
color: #ffffff;
|
||||
font-size: 26rpx;
|
||||
background-image:linear-gradient(to left,#2979ff,rgba(#2979ff,0.6));
|
||||
}
|
||||
}
|
||||
.wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100vh - var(--window-top));
|
||||
width: 100%;
|
||||
}
|
||||
.swiper-box {
|
||||
flex: 1;
|
||||
}
|
||||
.swiper-item {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.buttom {
|
||||
.loginType {
|
||||
font-size: 14px;
|
||||
position: fixed;
|
||||
right: 30rpx;
|
||||
bottom: 120rpx;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
padding: 4px;
|
||||
cursor: pointer;
|
||||
background: #FFF;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
border-radius: 100%;
|
||||
-webkit-box-shadow: 0px 1px 20px 0px rgba(0,0,0,0.1),inset 0px -1px 0px 0px rgba(0,0,0,0.1);
|
||||
box-shadow: 0px 1px 20px 0px rgba(0,0,0,0.1),inset 0px -1px 0px 0px rgba(0,0,0,0.1);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,233 +0,0 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-navbar :is-back="true" title="浏览记录" :border-bottom="false">
|
||||
<view class="u-nav-slot" slot="right" @click="clearHistory">
|
||||
<u-icon name="trash"></u-icon>
|
||||
清除
|
||||
</view>
|
||||
</u-navbar>
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
||||
<view class="page-box">
|
||||
<view v-if="houseHistory.length === 0">
|
||||
<view class="centre">
|
||||
<image :src="empty" mode=""></image>
|
||||
<view class="explain">
|
||||
您还没有浏览过的房源
|
||||
<view class="tips">可以去逛逛</view>
|
||||
</view>
|
||||
<view class="btn" @click="goHome">首页</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="order" v-for="(item, index) in houseHistory" :key="index"
|
||||
@click="clickImage(item.id)">
|
||||
<view class="top">
|
||||
<view class="left">
|
||||
<view class="store">{{ item.code }}</view>
|
||||
<u-icon name="arrow-right" color="rgb(203,203,203)" :size="26"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="left"><image :src="item.faceUrl" mode="aspectFill"></image></view>
|
||||
<view class="content">
|
||||
<view class="title u-line-2">
|
||||
{{item.villageName}} {{item.type == '整租' ? item.houseNum + item.houseHall + item.toiletNum : item.roomType}}
|
||||
</view>
|
||||
<view class="price">¥{{item.price}}</view>
|
||||
<view class="type">
|
||||
{{item.type}} | {{item.type == '整租' ? item.houseArea : item.roomArea}}㎡ | {{item.decoration}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="evaluate btn" @click="clickImage(item.id)">查看</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import config from "@/common/config.js" // 全局配置文件
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
empty:'/static/empty/default.png',
|
||||
houseHistory:uni.getStorageSync('houseHistory').reverse()
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
clickImage(houseId) {
|
||||
this.$u.route({
|
||||
url: '/pages/detail/detail',
|
||||
params: {
|
||||
houseId: houseId
|
||||
}
|
||||
})
|
||||
},
|
||||
goHome(){
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
})
|
||||
},
|
||||
clearHistory(){
|
||||
// 清除搜索记录
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否清除浏览记录？',
|
||||
cancelText: '取消',
|
||||
confirmText: '确认',
|
||||
success: res => {
|
||||
if(res.confirm){
|
||||
uni.removeStorageSync('houseHistory');
|
||||
this.houseHistory = []
|
||||
this.$mytip.toast('清除成功')
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* #ifndef H5 */
|
||||
page {
|
||||
height: 100%;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
/* #endif */
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.u-nav-slot{
|
||||
color: $u-tips-color;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.container{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
.empty{
|
||||
overflow: hidden;
|
||||
.tip{
|
||||
color: #909399 ;
|
||||
}
|
||||
.btn {
|
||||
color:#fff ;
|
||||
background-color: #909399;
|
||||
width:200rpx;
|
||||
padding: 15rpx 28rpx;
|
||||
border-radius: 130rpx;
|
||||
margin: 30rpx 0 0 100rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.order {
|
||||
width: 710rpx;
|
||||
background-color: #ffffff;
|
||||
margin: 20rpx auto;
|
||||
border-radius: 20rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.store {
|
||||
// margin: 0 10rpx;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
.right {
|
||||
color: #2979ff;
|
||||
}
|
||||
}
|
||||
.item {
|
||||
display: flex;
|
||||
margin: 20rpx 0 0;
|
||||
.left {
|
||||
margin-right: 30rpx;
|
||||
image {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
.title {
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
.price{
|
||||
margin: 10rpx 0;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.type {
|
||||
margin: 10rpx 0;
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bottom {
|
||||
display: flex;
|
||||
// margin-top: 40rpx;
|
||||
padding: 0 10rpx;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
.btn {
|
||||
margin-left: 20rpx;
|
||||
line-height: 52rpx;
|
||||
width: 160rpx;
|
||||
border-radius: 26rpx;
|
||||
border: 2rpx solid $u-border-color;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
color: $u-type-info-dark;
|
||||
}
|
||||
.evaluate {
|
||||
color: $u-tips-color;
|
||||
border-color: $u-tips-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
.centre {
|
||||
text-align: center;
|
||||
margin: 200rpx auto;
|
||||
font-size: 32rpx;
|
||||
image {
|
||||
width: 164rpx;
|
||||
height: 164rpx;
|
||||
border-radius: 50%;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.tips {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.btn {
|
||||
margin: 80rpx auto;
|
||||
width: 200rpx;
|
||||
border-radius: 32rpx;
|
||||
line-height: 64rpx;
|
||||
color: #ffffff;
|
||||
font-size: 26rpx;
|
||||
background-image:linear-gradient(to left,#2979ff,rgba(#2979ff,0.6));
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,149 +0,0 @@
|
||||
<template>
|
||||
<view class="page">
|
||||
<!-- 顶部自定义导航栏 -->
|
||||
<customNavbar title="我的租赁资产" />
|
||||
|
||||
<!-- 筛选栏 -->
|
||||
<!-- <view class="filter-bar">
|
||||
<u-button
|
||||
v-for="(item, index) in filters"
|
||||
:key="index"
|
||||
:type="currentFilter === item.value ? 'primary' : 'default'"
|
||||
size="mini"
|
||||
class="filter-btn"
|
||||
@click="changeFilter(item.value)"
|
||||
>
|
||||
{{ item.label }}
|
||||
</u-button>
|
||||
</view> -->
|
||||
|
||||
<!-- 租赁资产列表组件 -->
|
||||
<scroll-view
|
||||
scroll-y
|
||||
class="scroll-content"
|
||||
@scrolltolower="loadMore"
|
||||
>
|
||||
<asset-list
|
||||
:list="assetList"
|
||||
:load-status="loadStatus"
|
||||
@click="goDetail"
|
||||
/>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AssetList from '@/components/asset/assetList.vue'
|
||||
|
||||
export default {
|
||||
name: 'MyLease',
|
||||
components: { AssetList},
|
||||
data() {
|
||||
return {
|
||||
filters: [
|
||||
{ label: '全部', value: 'all' },
|
||||
{ label: '进行中', value: 'active' },
|
||||
{ label: '即将到期', value: 'expiring' },
|
||||
{ label: '已到期', value: 'expired' },
|
||||
],
|
||||
currentFilter: 'all',
|
||||
assetList: [],
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
loadStatus: 'loadmore',
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.loadAssets();
|
||||
},
|
||||
methods: {
|
||||
changeFilter(value) {
|
||||
if (this.currentFilter === value) return;
|
||||
this.currentFilter = value;
|
||||
this.pageNo = 1;
|
||||
this.assetList = [];
|
||||
this.loadAssets();
|
||||
},
|
||||
|
||||
loadAssets() {
|
||||
this.loadStatus = 'loading';
|
||||
|
||||
setTimeout(() => {
|
||||
const mock = [
|
||||
{
|
||||
id: 1,
|
||||
name: '科技园写字楼 501',
|
||||
address: '深圳市南山区科兴科学园 A 栋',
|
||||
// statusText: '进行中',
|
||||
// status: 'active',
|
||||
cover: '/static/img/index/swiper/swiper3.jpg',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '万科公寓 2101',
|
||||
address: '龙华区民治街道梅龙路 8 号',
|
||||
// statusText: '已到期',
|
||||
// status: 'expired',
|
||||
cover: '/static/img/index/swiper/swiper3.jpg',
|
||||
},
|
||||
];
|
||||
|
||||
let filtered = mock;
|
||||
if (this.currentFilter !== 'all') {
|
||||
filtered = mock.filter(item => item.status === this.currentFilter);
|
||||
}
|
||||
|
||||
this.assetList = this.pageNo === 1 ? filtered : [...this.assetList, ...filtered];
|
||||
this.loadStatus = 'nomore';
|
||||
}, 500);
|
||||
},
|
||||
|
||||
loadMore() {
|
||||
if (this.loadStatus === 'nomore') return;
|
||||
this.pageNo++;
|
||||
this.loadAssets();
|
||||
},
|
||||
|
||||
goDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/detail/assetsDetail?id=${item.id}`,
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
background: #f7f8fa;
|
||||
padding-top: 120rpx;
|
||||
}
|
||||
|
||||
.filter-bar {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
padding: 20rpx 0;
|
||||
margin-top: var(--custom-navbar-height);
|
||||
border-bottom: 1rpx solid #f0f0f0;
|
||||
|
||||
.filter-btn {
|
||||
min-width: 150rpx;
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
border-radius: 40rpx;
|
||||
margin: 0 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-content {
|
||||
flex: 1;
|
||||
height: calc(100vh - 200rpx);
|
||||
}
|
||||
</style>
|
||||
@@ -1,364 +0,0 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-navbar :is-back="true" title="我的委托" :border-bottom="false"></u-navbar>
|
||||
<view class="wrap">
|
||||
<view class="u-tabs-box">
|
||||
<u-tabs-swiper activeColor="#2979ff" ref="tabs" :list="list" :current="current" @change="change" :is-scroll="false" swiperWidth="750"></u-tabs-swiper>
|
||||
</view>
|
||||
<swiper class="swiper-box" :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish">
|
||||
<swiper-item class="swiper-item" v-for="(swiper,i) in orderList" :key="i">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
||||
<view class="page-box">
|
||||
<view v-if="swiper.length === 0">
|
||||
<view class="centre">
|
||||
<image :src="empty" mode=""></image>
|
||||
<view class="explain">
|
||||
您还没有相关的房源
|
||||
<view class="tips">可以去委托房源</view>
|
||||
</view>
|
||||
<view class="btn" @click="publishHouse">委托房源</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else
|
||||
class="order" v-for="(item, index) in swiper" :key="index">
|
||||
<view class="top">
|
||||
<view class="left">
|
||||
<view class="store">{{ item.code }}</view>
|
||||
<u-icon name="arrow-right" color="rgb(203,203,203)" :size="26"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="left"><image :src="item.image" mode="aspectFill"></image></view>
|
||||
<view class="content">
|
||||
<view class="title u-line-2">
|
||||
{{item.villageName}} {{item.type == '整租' ? item.houseNum + item.houseHall + item.toiletNum : item.roomType}}
|
||||
</view>
|
||||
<view class="price">¥{{item.price}}</view>
|
||||
<view class="type">
|
||||
{{item.type}} | {{item.type == '整租' ? item.houseArea : item.roomArea}}㎡ | {{item.decoration}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view v-if="item.state == 0" class="evaluate btn" @click.stop="clickImage(item.id)">修改</view>
|
||||
<view v-else class="evaluate btn" @click.stop="viewImage(item.id)">查看</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="buttom">
|
||||
<view class="loginType">
|
||||
<view class="wechat item">
|
||||
<view class="icon"><u-icon size="60" name="server-man" color="#999" @click="server"></u-icon></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import config from "@/common/config.js" // 全局配置文件
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
empty:'/static/empty/default.png',
|
||||
orderList: [[], [], [], []],
|
||||
list: [
|
||||
{
|
||||
name: '待审核'
|
||||
},
|
||||
{
|
||||
name: '待出租',
|
||||
// count: 1
|
||||
},
|
||||
{
|
||||
name: '已出租'
|
||||
},
|
||||
{
|
||||
name: '已下架',
|
||||
}
|
||||
],
|
||||
current: 0,
|
||||
swiperCurrent: 0,
|
||||
tabsHeight: 0,
|
||||
dx: 0,
|
||||
pageNum: 1,
|
||||
pageSize: 100,
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.getOrderList(0);
|
||||
this.getOrderList(1);
|
||||
this.getOrderList(2);
|
||||
this.getOrderList(3);
|
||||
},
|
||||
methods: {
|
||||
login(){
|
||||
this.$u.route('/pages/login/login')
|
||||
},
|
||||
// 页面数据
|
||||
getOrderList(idx) {
|
||||
this.findHouseList(idx)
|
||||
},
|
||||
// tab栏切换
|
||||
change(index) {
|
||||
this.swiperCurrent = index;
|
||||
this.orderList[index] = []
|
||||
this.getOrderList(index);
|
||||
},
|
||||
transition({ detail: { dx } }) {
|
||||
this.$refs.tabs.setDx(dx);
|
||||
},
|
||||
animationfinish({ detail: { current } }) {
|
||||
this.$refs.tabs.setFinishCurrent(current);
|
||||
this.swiperCurrent = current;
|
||||
this.current = current;
|
||||
},
|
||||
findHouseList(idx) {
|
||||
let url = "/api/houseApi/findHouseRoomList";
|
||||
let defaultData = {
|
||||
state:idx,
|
||||
publishId:uni.getStorageSync('lifeData').vuex_user.user.userId,
|
||||
villageCity:uni.getStorageSync('lifeData').vuex_city,
|
||||
pageNum: this.pageNum,
|
||||
pageSize: this.pageSize,
|
||||
orderByColumn: 'update_time,create_time',
|
||||
isAsc: 'desc'
|
||||
}
|
||||
this.$u.get(url, {...defaultData,...this.searchData}).then(result => {
|
||||
const data = result.rows;
|
||||
this.houseList = data;
|
||||
for (let i = 0; i < this.houseList.length; i++) {
|
||||
// 先转成字符串再转成对象，避免数组对象引用导致数据混乱
|
||||
let item = this.houseList[i]
|
||||
if(!item.faceUrl.includes(config.staticUrl)){
|
||||
item.image = config.staticUrl+item.faceUrl
|
||||
}else{
|
||||
item.image = item.faceUrl
|
||||
}
|
||||
if(item.type == 0){
|
||||
item.type = '整租'
|
||||
}else if(item.type == 1){
|
||||
item.type = '合租'
|
||||
}
|
||||
if(item.roomType == 1){
|
||||
item.roomType = '主卧'
|
||||
}else if(item.roomType == 2){
|
||||
item.roomType = '次卧'
|
||||
}else{
|
||||
item.roomType = '未知'
|
||||
}
|
||||
if(this.$u.test.isEmpty(item.houseNum)){
|
||||
item.houseNum = ''
|
||||
}
|
||||
if(this.$u.test.isEmpty(item.houseHall)){
|
||||
item.houseHall = ''
|
||||
}
|
||||
if(this.$u.test.isEmpty(item.toiletNum)){
|
||||
item.toiletNum = ''
|
||||
}
|
||||
this.orderList[idx].push(item);
|
||||
}
|
||||
});
|
||||
},
|
||||
publishHouse(){
|
||||
this.$u.route('/pages/detail/preHouse');
|
||||
},
|
||||
server(){
|
||||
// window.open ('https://sourcebyte.cn')
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: "18720989281",
|
||||
});
|
||||
},
|
||||
clickImage(houseId) {
|
||||
this.$u.route({
|
||||
url: '/pages/detail/preHouse',
|
||||
params: {
|
||||
houseId: houseId
|
||||
}
|
||||
})
|
||||
},
|
||||
viewImage(houseId){
|
||||
this.$u.route({
|
||||
url: '/pages/detail/detail',
|
||||
params: {
|
||||
houseId: houseId
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* #ifndef H5 */
|
||||
page {
|
||||
height: 100%;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
/* #endif */
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
.empty{
|
||||
overflow: hidden;
|
||||
.tip{
|
||||
color: #909399 ;
|
||||
}
|
||||
.btn {
|
||||
color:#fff ;
|
||||
background-color: #2979ff;
|
||||
width:200rpx;
|
||||
padding: 15rpx 28rpx;
|
||||
border-radius: 130rpx;
|
||||
margin: 30rpx 0 0 100rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.order {
|
||||
width: 710rpx;
|
||||
background-color: #ffffff;
|
||||
margin: 20rpx auto;
|
||||
border-radius: 20rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.store {
|
||||
// margin: 0 10rpx;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
.right {
|
||||
color: #2979ff;
|
||||
}
|
||||
}
|
||||
.item {
|
||||
display: flex;
|
||||
margin: 20rpx 0 0 0;
|
||||
.left {
|
||||
margin-right: 30rpx;
|
||||
image {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
.title {
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
.price{
|
||||
margin: 10rpx 0;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.type {
|
||||
margin: 10rpx 0;
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
}
|
||||
.desc {
|
||||
margin: 10rpx 0;
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bottom {
|
||||
display: flex;
|
||||
margin-top: 20rpx;
|
||||
padding: 0 10rpx;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
.btn {
|
||||
margin-left: 20rpx;
|
||||
line-height: 52rpx;
|
||||
width: 160rpx;
|
||||
border-radius: 26rpx;
|
||||
border: 2rpx solid $u-border-color;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
color: $u-type-info-dark;
|
||||
}
|
||||
.evaluate {
|
||||
// color: #2979ff;
|
||||
// border-color: #2979ff;
|
||||
color: $u-tips-color;
|
||||
border-color: $u-tips-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
.centre {
|
||||
text-align: center;
|
||||
margin: 200rpx auto;
|
||||
font-size: 32rpx;
|
||||
image {
|
||||
width: 164rpx;
|
||||
height: 164rpx;
|
||||
border-radius: 50%;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.tips {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.btn {
|
||||
margin: 80rpx auto;
|
||||
width: 200rpx;
|
||||
border-radius: 32rpx;
|
||||
line-height: 64rpx;
|
||||
color: #ffffff;
|
||||
font-size: 26rpx;
|
||||
background-image:linear-gradient(to left,#2979ff,rgba(#2979ff,0.6));
|
||||
}
|
||||
}
|
||||
.wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100vh - var(--window-top));
|
||||
width: 100%;
|
||||
}
|
||||
.swiper-box {
|
||||
flex: 1;
|
||||
}
|
||||
.swiper-item {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.buttom {
|
||||
.loginType {
|
||||
font-size: 14px;
|
||||
position: fixed;
|
||||
right: 30rpx;
|
||||
bottom: 120rpx;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
padding: 4px;
|
||||
cursor: pointer;
|
||||
background: #FFF;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
border-radius: 100%;
|
||||
-webkit-box-shadow: 0px 1px 20px 0px rgba(0,0,0,0.1),inset 0px -1px 0px 0px rgba(0,0,0,0.1);
|
||||
box-shadow: 0px 1px 20px 0px rgba(0,0,0,0.1),inset 0px -1px 0px 0px rgba(0,0,0,0.1);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,47 +0,0 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-navbar :is-back="true" :title="title" :border-bottom="false"></u-navbar>
|
||||
<view class="u-content">
|
||||
<u-parse :html="content"
|
||||
:autosetTitle="true"
|
||||
:show-with-animation="true"
|
||||
:selectable="true"
|
||||
></u-parse>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
title:'避坑指南',
|
||||
content: ``
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
let url = "/api/cmsApi/getServiceItemByAjax?type=租房避坑指南"
|
||||
this.$u.get(url).then(res => {
|
||||
// console.log(res.data.content);
|
||||
this.content = res.data.content
|
||||
});
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page{
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.u-content{
|
||||
// margin:0 10rpx;
|
||||
// padding: 24rpx;
|
||||
font-size: 34rpx;
|
||||
color: $u-main-color;
|
||||
line-height: 1.8;
|
||||
white-space: pre-wrap !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user