uniapp-ZHSQ/packages/community/serverList/index.vue

<template>
	<view class="container">
		<div class="tabList1">
			<div class="Tit">物业导航</div>
			<div class="functionList">
				<div class="functionItem" v-for="item in functionList" @click="desc(item)">
					<image mode="heightFix" :src="item.icon" />
					<div class="functionItemName">{{ item.name }}</div>
				</div>
			</div>
		</div>
		<div class="line"></div>

		<div class="tabList2">
			<div class="Tit">特色主题 <span>本小区已开通的特色服务</span></div>

			<div class="tabList">
				<div class="tabItem tabItem1">
					门禁通行
				</div>
				<div class="tabItem tabItem2">
					人人爱净水
				</div>
				<div class="tabItem tabItem3">
					馒头领取
				</div>

				<div class="tabItem tabItem3">
					健康驿站
				</div>
			</div>
		</div>

		<div class="line"></div>

		<div class="tabList3">
			<div class="Tit">上门服务</div>
			<div class="functionList">
				<div class="functionItem" v-for="item in localList" @click="desc(item)">
					<image mode="heightFix" :src="item.icon" />
					<div class="functionItemName">{{ item.name }}</div>
				</div>
			</div>
		</div>
		<div class="line"></div>
		<div class="tabList4">
			<div class="Tit">电商购物</div>
			<div class="functionList">
				<div class="functionItem" v-for="item in shopList" @click="desc(item)">
					<image mode="heightFix" :src="item.icon" />
					<div class="functionItemName">{{ item.name }}</div>
				</div>
			</div>
		</div>
		<div class="line"></div>
		<div class="tabList5">
			<div class="Tit">积分卡券</div>
			<div class="functionList">
				<div class="functionItem" v-for="item in shopList" @click="desc(item)">
					<image mode="heightFix" :src="item.icon" />
					<div class="functionItemName">{{ item.name }}</div>
				</div>
			</div>
		</div>


	</view>
</template>

<script>
import { request } from '../../../utils';
import { apiArr } from '../../../api/community';
export default {
	data() {
		return {
			functionList: [
				{
					icon: "http://192.168.0.172:5500/com_serverIcon1.png",
					name: "业主入驻",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon2.png",
					name: "我的房产",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon3.png",
					name: "生活缴费",
					url: "weixin://dl/business/?t=WvQ1ZJv0J5Z"
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon4.png",
					name: "便民服务",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon5.png",
					name: "物业公积金",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon6.png",
					name: "社区互动",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon7.png",
					name: "物业公积金",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon8.png",
					name: "物业服务",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon9.png",
					name: "报事报修",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon10.png",
					name: "物业缴费",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon11.png",
					name: "纠纷调解",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_serverIcon12.png",
					name: "社区管家",
					url: ""
				},
			],
			localList: [
				{
					icon: "http://192.168.0.172:5500/com_localIcon1.png",
					name: "美食",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_localIcon2.png",
					name: "家教",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_localIcon3.png",
					name: "超市",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_localIcon4.png",
					name: "健身",
					url: ""
				},
			],
			shopList: [
				{
					icon: "http://192.168.0.172:5500/com_shopIcon1.png",
					name: "电商购物",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_shopIcon2.png",
					name: "社区团购",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_shopIcon3.png",
					name: "本地优选",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_shopIcon4.png",
					name: "社区拼团",
					url: ""
				},
			],
			cardList: [
				{
					icon: "http://192.168.0.172:5500/com_cardIcon1.png",
					name: "我的积分",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_cardIcon2.png",
					name: "积分兑换",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_cardIcon3.png",
					name: "我的优惠卡",
					url: ""
				},
				{
					icon: "http://192.168.0.172:5500/com_cardIcon4.png",
					name: "我的会员卡",
					url: ""
				},
			]
		}
	},
	methods: {
		desc(e) {
			if (e.url && e.url.startsWith('weixin://')) {
				// 在UniApp中跳转微信
				if (uni.getSystemInfoSync().platform === 'android') {
					plus.runtime.openURL(e.url, function (err) {
						uni.showToast({
							title: '跳转失败，请手动打开微信',
							icon: 'none'
						});
					});
				} else {
					// iOS使用universal link或提示用户手动打开
					uni.showModal({
						title: '提示',
						content: '请在微信中打开生活缴费功能',
						confirmText: '打开微信',
						success(res) {
							if (res.confirm) {
								plus.runtime.openURL('weixin://');
							}
						}
					});
				}
			} else {
				console.log(e);
				// 其他处理逻辑
			}
		},

	},

	onLoad(options) {

	},

	onReachBottom() {

	},
}
</script>

<style>
@import url("./index.css");
</style>