tire_parts_shop_applets/pages/tabBar/center.vue

<template>
	<view>
		<view style="background-color:#E75F37;height: 250rpx;">
			<view style="padding: 33rpx;display: flex;align-items: center;">
				<view class="">
					<image src="/static/images/tabBar/head.png" style="width:100rpx;height: 100rpx;" mode="scaleToFill">
					</image>
				</view>
				<view style="color:#fff;margin-left: 13rpx;font-size: 30rpx;font-weight: 500;">
					{{name?name:''}}
				</view>
			</view>
		</view>
		<view class="card" style="height: 114rpx;">
			<view style="display: flex;justify-content: space-around;align-items: center;height: 114rpx;">
<!--				<text style="color:#818181;font-size: 24rpx;">
					产生积分:
					<text style="color:#FE8301;font-size: 26rpx;">
						{{form.addPoints?form.addPoints:'0.00'}}
					</text>
				</text>
				<text style="color:#818181;font-size: 24rpx;">
					使用积分:
					<text style="color:#FE8301;font-size: 26rpx;">
						{{form.subPoints?form.subPoints:'0.00'}}
					</text>
				</text>-->
				<text style="color:#818181;font-size: 24rpx;">
					积分余额:
					<text style="color:#FE8301;font-size: 26rpx;">
						{{form.pointsBalance?form.pointsBalance:'0.00'}}
					</text>
				</text>
        <text style="color:#818181;font-size: 24rpx;">
          现金余额:
          <text style="color:#FE8301;font-size: 26rpx;">
            {{form.recoveredBalance?form.recoveredBalance:'0.00'}}
          </text>
        </text>
			</view>
		</view>
		<view class="card" style="margin-top: 20rpx;height: 141rpx;">
			<view style="display: flex;justify-content: space-around;align-items: center;height: 141rpx;">
				<view style="display: flex;flex-direction:column;align-items: center;" @click="clickIntegralOrder">
					<image src="/static/images/tabBar/280-1.png" style="width:40rpx;height: 40rpx;" mode="scaleToFill">
					</image>
					<view style="color: #414141;font-size: 26rpx;margin-top: 13rpx;">积分订单
						<uni-icons type="right" size="13" color='#8A8A8A'></uni-icons>
					</view>
				</view>
				<view style="display: flex;flex-direction:column;align-items: center;" @click="inIntegralMall">
					<image src="/static/images/tabBar/280-2.png" style="width:40rpx;height: 40rpx;" mode="scaleToFill">
					</image>
					<view style="color: #414141;font-size: 26rpx;margin-top: 13rpx;" >积分商城
						<uni-icons type="right" size="13" color='#8A8A8A'></uni-icons>
					</view>
				</view>
				<view style="display: flex;flex-direction:column;align-items: center;" @click="RedemptionOfPoints">
					<image src="/static/images/tabBar/280-3.png" style="width:40rpx;height: 40rpx;" mode="scaleToFill">
					</image>
					<view style="color: #414141;font-size: 26rpx;margin-top: 13rpx;">我的积分
						<uni-icons type="right" size="13" color='#8A8A8A'></uni-icons>
					</view>
				</view>
			</view>
		</view>
		<view class="card" style="margin-top: 20rpx;height: 238rpx;padding: 20rpx 0;">
			<u-cell-group :border="false">
				<u-cell title="我的订单" value="查看全部订单" :border="false" :clickable="false" @click="pageJump('')">
					<view slot="right-icon">
						<uni-icons type="right" size="18" color='#D2D2D2'></uni-icons>
					</view>
				</u-cell>
			</u-cell-group>
			<view style="display: flex;justify-content: space-around;">
				<view style="display: flex;flex-direction:column;align-items: center;" @click="obligationBtn('待付款')">
					<image src="/static/images/tabBar/280@2x(1).png" style="width:81rpx;height: 81rpx;"
						mode="scaleToFill">
					</image>
					<view style="color: #414141;font-size: 26rpx;margin-top: 13rpx;">待付款</view>
				</view>
				<view style="display: flex;flex-direction:column;align-items: center;" @click="pageJump('待发货')">
					<image src="/static/images/tabBar/280@2x(2).png" style="width:81rpx;height: 81rpx;"
						mode="scaleToFill">
					</image>
					<view style="color: #414141;font-size: 26rpx;margin-top: 13rpx;">待发货</view>
				</view>
				<view style="display: flex;flex-direction:column;align-items: center;" @click="pageJump('待收货')">
					<image src="/static/images/tabBar/280@2x(3).png" style="width:81rpx;height: 81rpx;"
						mode="scaleToFill">
					</image>
					<view style="color: #414141;font-size: 26rpx;margin-top: 13rpx;">待收货</view>
				</view>
				<view style="display: flex;flex-direction:column;align-items: center;" @click="pageJump('已收货')">
					<image src="/static/images/tabBar/280@2x(4).png" style="width:81rpx;height: 81rpx;"
						mode="scaleToFill">
					</image>
					<view style="color: #414141;font-size: 26rpx;margin-top: 13rpx;">已完成</view>
				</view>
				<view style="display: flex;flex-direction:column;align-items: center;" @click="pageJump('退款售后')">
					<image src="/static/images/tabBar/280@2x(5).png" style="width:81rpx;height: 81rpx;"
						mode="scaleToFill">
					</image>
					<view style="color: #414141;font-size: 26rpx;margin-top: 13rpx;">退款/售后</view>
				</view>
			</view>
		</view>
		<view class="card2" style="margin-top: 20rpx;display: flex;align-items: center;">
			<u-cell-group :border="false">
				<u-cell title="个人资料" :clickable="true" @click="clickMeans">
					<view slot="icon">
						<image src="/static/images/tabBar/100.png"
							style="width:26rpx;height: 27rpx;margin-right: 10rpx;" mode="scaleToFill">
						</image>
					</view>
					<view slot="right-icon">
						<uni-icons type="right" size="18" color='#CCCCCC'></uni-icons>
					</view>
				</u-cell>
				<u-cell title="员工信息" :clickable="true" @click="clickContacts">
					<view slot="icon">
						<image src="/static/images/tabBar/101.png"
							style="width:26rpx;height: 27rpx;margin-right: 10rpx;" mode="scaleToFill">
						</image>
					</view>
					<view slot="right-icon">
						<uni-icons type="right" size="18" color='#CCCCCC'></uni-icons>
					</view>
				</u-cell>
				<u-cell title="地址管理" :clickable="true" @click="clickAddress">
					<view slot="icon">
						<image src="/static/images/tabBar/102.png"
							style="width:26rpx;height: 27rpx;margin-right: 10rpx;" mode="scaleToFill">
						</image>
					</view>
					<view slot="right-icon">
						<uni-icons type="right" size="18" color='#CCCCCC'></uni-icons>
					</view>
				</u-cell>
				<u-cell title="设置" :clickable="true" :border="false" @click="setUp">
					<view slot="icon">
						<image src="/static/images/tabBar/103.png"
							style="width:26rpx;height: 27rpx;margin-right: 10rpx;" mode="scaleToFill">
						</image>
					</view>
					<view slot="right-icon">
						<uni-icons type="right" size="18" color='#CCCCCC'></uni-icons>
					</view>
				</u-cell>
			</u-cell-group>
		</view>
		<!-- 提取去登录 -->
		<u-modal :show="adminShow" :showCancelButton="true" content='当前还未登录请先登录！！' @confirm="adminConfirm"
			@cancel="adminCancel"></u-modal>
	</view>
</template>

<script>
	import {
		details,
		corpPointsDetail
	} from '@/api/views/personalInformation/index.js'
	export default {
		data() {
			return {
				name: null,
				badgeList: [],
				form: {},
				adminShow: false,
			}
		},
		onShow() {
			this.getUpdate()
			if (uni.getStorageSync('userInfo').tenant_id == '000000') {
				this.adminShow = true
			}
			details().then(res => {
				this.name = res.data.cname
				corpPointsDetail({
					corpId: res.data.id
				}).then(e => {
					this.form = e.data
          this.form.recoveredBalance = res.data.recoveredBalance
				})
			})
		},
		methods: {
			getUpdate() {
				const updateManager = uni.getUpdateManager();
				updateManager.onCheckForUpdate(function(res) {
					// 请求完新版本信息的回调
					if (res.hasUpdate) {
						updateManager.onUpdateReady(function() {
							uni.showModal({
								title: '更新提示',
								content: '新版本已经准备好，是否重启应用？',
								success: function(res) {
									if (res.confirm) {
										// 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
										updateManager.applyUpdate();
									}
								}
							});
						});

						updateManager.onUpdateFailed(function() {
							// 新的版本下载失败
							uni.showModal({
								title: '已经有新版本了哟~',
								content: '新版本已经上线啦~，请您删除当前小程序，重新搜索打开哟~'
							});
						});
					}
				});
			},
			// 确认
			adminConfirm() {
				uni.clearStorageSync();
				uni.redirectTo({
					url: '/pages/login/login'
				})
			},
			// 取消
			adminCancel() {
				uni.switchTab({
					url: '/pages/tabBar/home'
				})
			},
			clickCall() {
				uni.makePhoneCall({
					phoneNumber: this.form.contactNumber,
					success: function() {
						console.log('拨打电话成功');
					},
					fail() {
						console.log('打电话失败了');
					}
				})
			},
			setUp() {
				this.$u.route('/pages/user/setUp');
			},
			clickMeans() {
				uni.$u.route('/pages/views/personalInformation/index');
			},
			clickContacts() {
				uni.$u.route('/pages/views/personalInformation/contacts');
			},
			clickAddress() {
				this.$u.route('/pages/views/personalInformation/addressManagement');
			},
			// 车型
			clickVehicle() {
				this.$u.route('/pages/tabBar/vehicleModel');
			},
			// 积分商城
			clickPointsMall() {
				this.$u.route('/pages/tabBar/pointsMall');
			},
			clickIntegralOrder() {
				this.$u.route('/pages/views/salesSlip/IntegralOrder');
			},
			// 积分兑换记录
			RedemptionOfPoints() {
				this.$u.route('/pages/tabBar/integralList/index');
			},
			// 积分获取记录
			obtainRecord() {
				this.$u.route('/pages/tabBar/integralList/obtainRecord');
			},
			// 消费记录
			consumptionRecord() {
				this.$u.route('/pages/tabBar/integralList/consumptionRecord');
			},
			pageJump(value) {
				uni.$u.route('/pages/views/salesSlip/index', {
					text: value
				});
			},
			obligationBtn(value) {
				uni.$u.route('/pages/views/salesSlip/obligation', {
					text: value
				});
			},
			inIntegralMall() {
				uni.$u.route('/pages/integralMall/index');
			}
		}
	}
</script>
<style lang="scss" scoped>
	.card {
		position: relative;
		margin: 0 32rpx;
		background-color: #fff;
		border-radius: 14rpx;
		bottom: 96rpx;

		::v-deep .u-cell__title-text {
			font-size: 26rpx;
			color: #333333;
		}

		::v-deep .u-cell__value {
			font-size: 24rpx;
			color: #CBCBCB;
		}

		::v-deep .u-icon__icon--info {
			font-size: 28rpx !important;
			color: #CBCBCB;
		}
	}

	.card2 {
		position: relative;
		margin: 0 32rpx;
		background-color: #fff;
		border-radius: 14rpx;
		bottom: 96rpx;

		::v-deep .u-cell__title-text {
			font-size: 24rpx;
			font-weight: 400;
			color: #797979;
		}
	}
</style>