uniapp-ZHSQ/packages/storeManagement/index/index.vue

<template>
	<view class="container">
		<!-- <view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
			<view class="searchBox_add">
				<u-icon bold color="#000" size="40" name="arrow-left" @click="back"></u-icon>
			</view>
		</view> -->

		<view class="community">
			<view class="community_left">
				<image mode="aspectFill" :src="selectedShop.album_images" alt="" />
			</view>
			<view class="community_right" @click="changeShow">
				<view class="community_right_text">
					<view class="community_right_text1">{{ selectedShop.merchant_name }}</view>
					<view class="community_right_text2">{{ selectedShop.address }}</view>
				</view>
				<view class="community_right_more">
					<u-icon bold color="#999999" size="30" name="arrow-right"></u-icon>
				</view>
			</view>
		</view>

		<view class="content">
			<view class="walletBox">
				<view class="walletBox_top">钱包</view>
				<view class="walletBox_content">
					<view class="walletBox_item" @click="goWallet(1)">
						<view>999.00元</view>
						<view class="walletBox_item_text">保证金</view>
					</view>
					<view class="walletBox_item" @click="goWallet(2)">
						<view>999.00元</view>
						<view class="walletBox_item_text">应收</view>
					</view>
					<view class="walletBox_item" @click="goWallet(3)">
						<view>999.00元</view>
						<view class="walletBox_item_text">手续费</view>
					</view>
				</view>
			</view>
			<view class="iconStyle content2">
				<u-grid col="6" :border="false">
					<u-grid-item v-for="(item, index) in baseList" :key="index" @click="click(item)">
						<view class="grid-item">
							<image class="nav_icon" :src="item.image" mode=""></image>
						</view>
						<text class="grid-text">{{ item.name }}</text>
					</u-grid-item>
				</u-grid>
			</view>
		</view>


		<view class="boxshadow" v-if="show" @click="changeShow">
			<view class="boxshadowCon">
				<view class="boxshadowCon_Tit">
					请选择店铺
					<br />
					<view class="boxshadowCon_Text">从以下列表中选择您的管理权限的店铺</view>
					<view class="cancel">确定</view>
				</view>
				<view class="lines"></view>
				<view class="communityList">
					<view class="boxshadowCon_Text2">您有{{ shopList.length }}个店铺的管理权限</view>
					<view style="width: 100%;height: 200rpx;">
						<view class="communityItem" v-for="(item, index) in shopList" :key="index">
							<view class="community_left">
								<image mode="aspectFill" :src="item.album_images" alt="" />
							</view>
							<view class="community_right" @click="changeShow2(item)">
								<view class="community_right_text">
									<view class="community_right_text1">{{ item.merchant_name }}</view>
									<view class="community_right_text2">{{ item.address }}</view>
								</view>
							</view>
							<view class="communityItem_radio" @click="changeShow2(item)">
								<radio :checked="selectedShop.merchant_name === item.merchant_name"></radio>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>

	</view>

</template>

<script>
import {
	request,
	picUrl,
	uniqueByField,
	menuButtonInfo,
	NavgateTo
} from '../../../utils';
import {
	apiArr
} from '../../../api/community';


export default {
	data() {
		return {
			top: "",
			localHeight: "",
			active: 1,
			show: false,
			show2: false,
			shopList: [],
			selectedShop: {},
			baseList: [
				{
					image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/page_user_Group_1568.png",
					name: "订单",
					url: "/packages/storeManagement/order/index",
				}, {
					image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/gp_cancelAfterVerification.png",
					name: "到店核销",
					url: "/packages/storeManagement/orderVerification/index",
				}, {
					image: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kefu0.png",
					name: "客服",
					url: "/packages/customerService/chattingRecords/index",
				}
			],
		}
	},
	onLoad(options) {
		const meun = menuButtonInfo();
		this.top = meun.top;
		// this.top = meun.height + meun.top;
		this.localHeight = meun.height;
		this.getShopList();
	},


	methods: {
		// 获取商家列表
		getShopList() {
			request(apiArr.getShopList, 'POST', {}, { silent: false }).then(res => {
				res.rows.map(item => {
					item.album_images = picUrl + item.album_images;
				})
				this.shopList = res.rows;
				if (this.shopList.length > 0) {
					this.selectedShop = this.shopList[0];
				}
			})
		},
		goWallet(type) {
			NavgateTo('/packages/storeManagement/wallet/index?type=' + type);
		},
		changeTab(index) {
			this.active = index;
		},
		back() {
			uni.navigateBack({
				delta: 1
			});
		},
		changeShow() {
			this.show = !this.show
		},
		changeShow2(item) {
			this.selectedShop = item;
			this.show = false;
		},
		click(item) {
			// 根据item中的url进行跳转
			if (item.url) {
				NavgateTo(item.url)
			} else {
				console.warn('未配置跳转URL');
				// 可添加默认跳转或提示
			}
		}
	},


}
</script>

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