parts_shop_ui_LT/pages/tabBar/home.vue

<template>
	<view>
		<view class="status_bar">
			<view style="display: flex;justify-content: space-between;color: #fff;">
				<view style="width: 27%;height: 80rpx;margin: 0 2% 0 1%;">
					<image style="width: 100%;height: 100%;" src="../../static/images/logo/logo_white.png" mode="">
					</image>
				</view>
				<view style="width: 5rpx;background-color: #fff;border-radius: 10rpx;"></view>

				<view style="width: 68%;margin-left: 2%;
				text-align: left;line-height: 80rpx;font-weight: bold;font-size: 32rpx;">
					{{deptName}}
					<!-- <view >{{form.tenantName}}</view>
					<view >{{deptName}}</view> -->
				</view>
			</view>
			<view class="quick">
				<!-- <view class="census">
					<view>营业收入：1232131元</view>
					<view>付款金额：31231231元</view>
				</view> -->
				<view class="ability">
					<u-grid :border="false">
						<u-grid-item @click="pageJump('salesSlip')">
							<image style="width: 80rpx;height: 80rpx;" src="../../static/images/view/home/sale.png">
							</image>
							<text class="grid_text">销售开单</text>
						</u-grid-item>
						<u-grid-item @click="pageJump('stock')">
							<image style="width: 80rpx;height: 80rpx;" src="../../static/images/view/home/stock.png">
							</image>
							<text class="grid_text">库存查询</text>
						</u-grid-item>
						<!-- <u-grid-item @click="pageJump('operatingReceipts')">
							<image style="width: 80rpx;height: 80rpx;" src="../../static/images/view/home/collect.png">
							</image>
							<text class="grid_text">经营收款</text>
						</u-grid-item> -->

						<u-grid-item @click="pageJump('customer')">
							<image style="width: 80rpx;height: 80rpx;" src="../../static/images/view/home/collect.png">
							</image>
							<text class="grid_text">客户信息</text>
						</u-grid-item>

					</u-grid>
				</view>
			</view>
		</view>
		<view class="swiper">
			<u-swiper :list="list" radius="36rpx" keyName="image" height="90" :autoplay="false" circular></u-swiper>
		</view>
		<view class="quick_desktop">
			<u-cell-group :border="false">
				<u-cell icon="integral-fill" :border="false" title="工作桌面">
					<view slot="icon" style="width: 10rpx;height: 35rpx;background-color: #fd5003;"></view>
					<view slot="right-icon">
						<u-icon name="grid" size="28"></u-icon>
					</view>
				</u-cell>
			</u-cell-group>
			<u-grid :border="false" col="4">
				<u-grid-item v-show="item.inShow" v-for="(item,index) in dataList" :key="index"
					@click="pageJump(item.value)" style="margin: 20rpx 0;">
					<u-badge style="z-index: 1000;" v-if='item.badgeShow' numberType="overflow" absolute
						:offset="[-5,20]" :value="item.badgeNum"></u-badge>
					<image style="width: 60rpx;height: 60rpx;" :src="item.url" mode=""></image>
					<text class="grid_text">{{item.text}}</text>
				</u-grid-item>
			</u-grid>
		</view>
		<u-toast ref="uToast" />
		<!-- 更新组件 force 是否强制更新    tabbar：页面是否有原生tabbar组件-->
		<app-update ref="app_update" :force="false" :tabbar="true"></app-update>
	</view>
</template>
<script>
	import appUpdate from "@/components/yzhua006-update/app-update.vue"
	import {
		getList,
		getParamservice
	} from '@/api/views/approve/index.js'
	import {
		queryList
	} from '@/api/views/sale/salesOrderList.js'
	import {
		shipList
	} from '@/api/OutboundTask/index.js'
	import {
		revenueExpenditure,
		deptlazyList
	} from "@/api/home/index.js"
	import {
		listAll
	} from '@/api/views/approve/index.js'
	export default {
		components: {
			appUpdate
		},
		data() {
			return {
				badgeNum: 0,
				deptName: '',
				list: [{
					image: "../../static/images/view/home/swiper.png"
				}],
				form: {},
				dataList: [
					// {
					// 		url: "../../static/images/view/home/desktop/customer.png",
					// 		text: "客户信息",
					// 		value: "customer"
					// },
					// {
					// 	url: "../../static/images/view/home/desktop/visit.png",
					// 	text: "拜访记录",
					// 	value: "visit"
					// },
					{
						url: "../../static/images/view/home/desktop/order.png",
						text: "销售列表",
						value: "salesOrderList",
						badgeShow: true,
						badgeNum: 0,
						inShow: true,
					},
					{
						url: "../../static/images/view/home/desktop/shebeda.png",
						text: "出库任务",
						value: "OutboundTask",
						badgeShow: true,
						badgeNum: 0,
						inShow: true,
					},
					{
						url: "../../static/images/view/home/desktop/delivery.png",
						text: "仓库出库",
						value: "warehouseDelivery",
						badgeShow: true,
						badgeNum: 0,
						inShow: true,
					},
					{
						url: "../../static/images/view/home/desktop/product.png",
						text: "待审客户",
						value: "customerSubmit",
						inShow: true,
					},
					{
						url: "../../static/images/view/home/desktop/visit.png",
						text: "审批数据",
						badgeShow: true,
						value: "approve",
						badgeNum: 0,
						inShow: true,
					},
					{
						url: "../../static/images/view/home/desktop/customer.png",
						text: "融资采购",
						badgeShow: true,
						value: "procurement",
						badgeNum: 0,
						inShow: false,
					},
					{
						url: "../../static/images/view/home/desktop/visit.png",
						text: "融资审核",
						badgeShow: true,
						value: "financingReview",
						badgeNum: 0,
						inShow: false,
					},
					{
						url: "../../static/images/view/home/desktop/shebeda.png",
						text: "出库审核",
						badgeShow: true,
						value: "outboundTask",
						badgeNum: 0,
						inShow: false,
					},
					{
						url: "../../static/images/view/home/desktop/shebewx.png",
						text: "客户分析",
						badgeShow: false,
						value: "customerAnalysis",
						inShow: true,
					},
          {
            url: "../../static/images/view/home/desktop/green-recycling.png",
            text: "绿色回收",
            badgeShow: false,
            value: "greenRecycling",
            inShow: true,
          }
					// {
					// 	url: "../../static/images/view/home/desktop/product.png",
					// 	text: "上架轮胎",
					// 	value: "product"
					// },
					// ,{
					// 	url: "../../static/images/view/home/desktop/achievements.png",
					// 	text: "绩效考核"
					// }
					// , {
					// 	url: "../../static/images/view/home/desktop/order.png",
					// 	text: "销售订单",
					// 	value: "toBeCollectedlist"
					// },
					// , {
					// 	url: "../../static/images/view/home/desktop/delivery.png",
					// 	text: "送货管理"
					// }
					// , {
					// 	url: "../../static/images/view/home/desktop/collection.png",
					// 	text: "收款管理",
					// 	value: "collectionManagement"
					// }
					// , {
					// 	url: "../../static/images/view/home/desktop/returnGoods.png",
					// 	text: "退货管理"
					// }, {
					// 	url: "../../static/images/view/home/desktop/shoppingMall.png",
					// 	text: "商城信息"
					// }
					// , {
					// 	url: "../../static/images/view/home/desktop/goOnline.png",
					// 	text: "产品上架",
					// 	value: "productLaunch",
					// }, {
					// 	url: "../../static/images/view/home/desktop/purchase.png",
					// 	text: "采购管理",
					// 	value: "purchase"
					// }, {
					// 	url: "../../static/images/view/home/desktop/shebewx.png",
					// 	text: "维修报单",
					// 	value: "RepairReportList"
					// }, {
					// 	url: "../../static/images/view/home/desktop/shebeda.png",
					// 	text: "设备档案",
					// 	value: "EquipmentArchives"
					// }
					// , {
					// 	url: "../../static/images/view/home/desktop/cost.png",
					// 	text: "费用管理"
					// }
				],
			}
		},
		mounted() {
			this.$refs.app_update.update();

		},
		onShow() {
			console.log(11111)
			getParamservice(1, 10, {
				paramKey: 'whether.financing'
			}).then(res => {
				if (res.data.records.find(e => e.paramValue == 1)) {
					this.dataList.forEach(e => {
						if (e.text == '融资采购') {
							e.inShow = true
						}
						if (e.text == '融资审核') {
							e.inShow = true
						}
						if (e.text == '出库审核') {
							e.inShow = true
						}
					})
				}

			})
			// dept_id
			revenueExpenditure({
				tenantId: uni.getStorageSync('userInfo').tenant_id
			}).then(res => {
				this.form = res.data
				uni.setStorageSync('information', res.data);
			})
			// 获取机构数据
			deptlazyList().then(res => {
				let deptId = uni.getStorageSync('userInfo').dept_id
				for (let item of res.data) {
					if (deptId == item.id) {
						this.deptName = item.deptName
					}
				}
			})
			getList({
				auditStatus: 'S'
			}).then(res => {
				this.dataList.forEach(e => {
					if (e.text == '审批数据') {
						e.badgeNum = res.data.total
					}
				})
			})
			queryList({
				bsType: 'XS',
				status: '待确认',
				notComplete: 1,
			}).then(res => {
				this.dataList.forEach(e => {
					if (e.text == '销售列表') {
						e.badgeNum = res.data.total
					}
				})
			})
			shipList({
				bizTypeName: 'FHRW',
				statusName: '待处理'
			}).then(res => {
				this.dataList.forEach(e => {
					if (e.text == '出库任务') {
						e.badgeNum = res.data.total
					}
				})
			})
			shipList({
				bizTypeName: 'FHGD',
				statusName: '待出库'
			}).then(res => {
				this.dataList.forEach(e => {
					if (e.text == '仓库出库') {
						e.badgeNum = res.data.total
					}
				})
			})
		},
		methods: {
			pageJump(value) {
				switch (value) {
					case 'warehouseDelivery':
						this.$u.route('/pages/views/warehouseDelivery/salesOrderList');
						break;
					case "salesSlip":
						uni.$u.route('/pages/views/salesSlip/index');
						break;
					case "stock":
						uni.$u.route('/pages/views/stock/index');
						break;
					case "product":
						uni.$u.route('/pages/views/product/index');
						break;
					case "customer":
						uni.$u.route('/pages/views/customer/index');
						break;
					case "purchase":
						uni.$u.route('/pages/views/purchase/index');
						break;
					case "toBeCollectedlist":
						uni.$u.route('/pages/views/salesSlip/toBeCollectedlist');
						break;
					case "operatingReceipts":
						uni.$u.route('/pages/views/salesSlip/toBeCollectedlistBatch');
						break;
					case "collectionManagement":
						this.$refs.uToast.warning("该功能开发中")
						// uni.$u.route('/pages/views/salesSlip/collectionManagement');
						break;
					case 'visit':
						this.$u.route('/pages/views/visit/visit');
						break
					case 'productLaunch':
						this.$u.route('/pages/views/productLaunch/index');
						// this.$u.route('/pages/views/bluetooth/index');
						break
					case 'EquipmentArchives':
						this.$u.route('/pages/device/EquipmentArchives/EquipmentArchives');
						break
					case 'RepairReportList':
						this.$u.route('/pages/device/RepairReportList/RepairReportList');
						break
					case 'OutboundTask':
						this.$u.route('/pages/OutboundTask/OutboundTask');
						break
					case 'salesOrderList':
						this.$u.route('/pages/views/salesSlip/salesOrderList');
						break
					case "customerSubmit":
						uni.$u.route('/pages/views/customerSubmit/index');
						break;
					case "approve":
						uni.$u.route('/pages/views/approve/index');
						break;
					case "procurement":
						uni.$u.route('/pages/views/procurement/index');
						break;
					case "financingReview":
						uni.$u.route('/pages/views/financingReview/index');
						break;
					case "outboundTask":
						uni.$u.route('/pages/views/outboundTask/index');
						break;
					case "customerAnalysis":
						uni.$u.route('/pages/views/customerAnalysis/index');
						break;
          case "greenRecycling":
            uni.$u.route('/pages/views/recycling/index');
            break;
					default:
						this.$refs.uToast.success("该功能暂未开发~")
				}
			}
		}
	}
</script>
<style lang="scss" scoped>
	.quick_desktop {
		width: 96%;
		padding-bottom: 20rpx;
		background-color: #fff;
		margin: 0 auto;
		margin-top: 20rpx;
		border-radius: 20rpx;
	}

	.swiper {
		width: 96%;
		margin: 0 auto;
		margin-top: 20rpx;
		background-color: #fff;
		border-radius: 100rpx;
		box-shadow: 0px 14rpx 38rpx 4rpx rgba(52, 52, 52, 0.03);
	}

	.status_bar {
		width: 100%;
		background: url("../../static/images/view/home/head_bg.png") no-repeat;
		background-size: 100% 100%;
		padding-top: var(--status-bar-height);
	}

	.quick {
		margin-top: 60rpx;
		box-shadow: 0px 14rpx 38rpx 4rpx rgba(52, 52, 52, 0.03);

		.census {
			width: 96%;
			margin: 0 auto;
			color: #fff;
			display: flex;
			justify-content: space-around;
			font-size: 32rpx;
			// view:nth-child(1){
			// 	width: 50%;
			// }
			// view:nth-child(2){
			// 	width: 50%;
			// }
		}

		.ability {
			background-color: #fff;
			width: 96%;
			padding: 40rpx 0;
			margin: 0 auto;
			border-radius: 20rpx;
		}
	}

	.grid_text {
		font-size: 28rpx;
		color: #333333;
		// font-weight: bold;
		padding-top: 5rpx;
	}
</style>