From df481aebfb7a19eea5d6c02f93c6f5776b0fdc19 Mon Sep 17 00:00:00 2001
From: cuiqian2004 <cuiqian2004@163.com>
Date: 星期五, 23 五月 2025 18:30:41 +0800
Subject: [PATCH] 界面大模式

---
 pages/index/index.vue |  398 ++++++++++++++++++++++++++++++++++++--------------------
 1 files changed, 252 insertions(+), 146 deletions(-)

diff --git a/pages/index/index.vue b/pages/index/index.vue
index d9a6c2a..65923ce 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,137 +1,180 @@
 <template>
-	<view class="uni-page-index">
-		<view class="v-area" v-for="(area,index) in data">
-			<p :data-key="area.ID?area.ID:area.id">{{ area.Name?area.Name:area.name }}</p>
-			<ul class="areaList">
-				<!-- Mobox2 -->
-				<li v-for="(app,key) in area.App">
-					<a @tap="appCreate(app)" class="logo" :style="{'background-color':app.BkColor,'color':app.BkColor}">
-						<i :class="app.ImgFontStyle" :style="{'color':app.TxtColor}"></i>
-					</a>
-					<p :data-key="app.ID">{{ app.Name }}</p>
-				</li>
-				<!-- Mobox3 -->
-				<li v-for="(app,key) in area.app_list">
-					<a @tap="appCreate(app)" class="logo"
-						:style="{'background-color':app.bk_color,'color':app.bk_color}">
-						<i :class="app.img_font_style" :style="{'color':app.txt_color}"></i>
-					</a>
-					<p :data-key="app.id">{{ app.name || app.list_name}}</p>
-				</li>
+	<view class="uni-page-index" :class="largeMode?'large-mode':''">
+		<view class="area-list" v-if="isMobox3">
+			<view class="v-area" v-for="(area,index) in data">
+				<view class="area-name">{{ area.name }}</view>
+				<view class="app-list">
+					<view class="app" v-for="(app,key) in area.app_list" :key="key">
+						<a @click="onClickApp(app)" class="logo"
+							:style="{'background-color':app.bk_color,'color':app.bk_color}">
+							<text class="ico" :class="app.img_font_style" :style="{'color':app.txt_color}"></text>
+						</a>
+						<view @click="onClickApp(app)" class="app-name">{{app.name}}</view>
+					</view>
+				</view>
+			</view>
 
-			</ul>
 		</view>
-
+		<view class="area-list" v-else>
+			<view class="v-area" v-for="(area,index) in data">
+				<view class="area-name">{{ area.Name }}</view>
+				<view class="app-list">
+					<view class="app" v-for="(app,key) in area.App" :key="key">
+						<a @click="onClickApp(app)" class="logo"
+							:style="{'background-color':app.BkColor,'color':app.BkColor}">
+							<text class="ico" :class="app.ImgFontStyle" :style="{'color':app.TxtColor}"></text>
+						</a>
+						<view @click="onClickApp(app)" class="app-name">{{app.Name}}</view>
+					</view>
+				</view>
+			</view>
+		</view>
 	</view>
 </template>
 
 <script>
-	import Base64 from '../../components/js-base64/base64.js'
+	import {
+		Base64
+	} from '@/js/Base64.js';
+	import utils from "@/js/utils.js"
+	import {
+		areaFunc
+	} from "@/api/index.js"
+	import {
+		getFuncTree
+	} from "@/api/mobox.js"
+	import buttonClickMixin from '@/mixins/button-click.js';
+
 	export default {
-		modules: {
-			Base64,
-		},
+		mixins: [buttonClickMixin],
 		onNavigationBarButtonTap(e) {
-			// console.log(e.text);
-			// console.log(e.fontSize);
-			this.$store.state.areaFunc = '';
-			this.$store.commit("classAttrList", null);
-			this.$store.commit("classGridStyleInfo", null);
-			this.$store.commit("dicValueInfo", null);
-			this.$store.commit("subClassAttrList", null);
-			this.$store.commit("subClassGridStyleInfo", null);
-			//鍒锋柊褰撳墠椤甸潰
-			// location.reload();
-			uni.redirectTo({
-				url: '../index/index?args=9999999999'
-			});
+			this.loadData()
 		},
 		data() {
 			return {
+				largeMode: getApp().globalData.largeMode || false,
 				title: 'Hello',
-				data: []
+				data: [],
+				isMobox3: getApp().globalData.isMobox3,
 			}
 		},
 		onLoad(options) {
 			console.log(options);
 			// 鑾峰彇鎵�湁AppType="MES",ClientType="2"(PDA)鐨勫紩鐢ㄩ鍩熷姛鑳界偣淇℃伅
 
-			if (this.$store.state.areaFunc)
-				this.data = this.$store.state.areaFunc.data;
-			else
-				this.$store.dispatch('areaFunc', {}).then(success => {
-					// console.log(success);
-					if (success.code == '00000' || success.err_code == 0) {
-						this.data = success.data;
-						
-						if (success.err_code != undefined) { //鍒ゆ柇鏄惁鏄疢obox3
-							success.result.forEach(async (area, index) => {
-								if (area.client_type == 2) { //鍒ゆ柇绫诲瀷鏄惁鏄疨DA绫诲瀷
-									await this.GetFuncTree(index, area);
-								}
-							});
-						}
-					} else {
-						uni.showModal({
-							title:this.translateSys("error"),
-							content: success.msg,
-							showCancel: false,
-							confirmText:this.translateSys("cancel")
-						});
-					}
-				}).catch(ex => {
-					// console.log(ex);
-					uni.showModal({
-						title: this.translateSys("error"),
-						content: ex.errMsg,
-						showCancel: false,
-						confirmText:this.translateSys("cancel")
-					});
-				});
+			this.loadData()
 
 		},
 		methods: {
-			async GetFuncTree(index, area) { //Mobox3鑾峰彇搴旂敤棰嗗煙鐨勫姛鑳界偣
-				this.data = [];
-				var $this = this;
-				var json = {
-					app_type: "MES",
-					area_id: area.id,
-					area_client_type: area.client_type,
-					need_ace: '0',
-				};
-				this.$store.dispatch('GetFuncTree', json).then(success => {
-					// console.log(success);
-					if (success.err_code == 0) {
-						if ((success.result || []).length > 0) {
-							$this.data.push(success.result[0]);
-							console.log("onLoad",$this.data )
-							this.$store.commit("areaFunc", $this.data);
-						}
+			setData: function(obj) {
+				let that = this;
+				let keys = [];
+				let val, data;
 
-					} else {
-						uni.showModal({
-							title:this.translateSys("error"),
-							content: success.msg,
-							showCancel: false,
-							confirmText: this.translateSys("cancel")
-						});
-					}
-				}).catch(ex => {
-					// console.log(ex);
-					uni.showModal({
-						title: this.translateSys("error"),
-						content: ex.errMsg,
-						showCancel: false,
-						confirmText: this.translateSys("cancel")
+				Object.keys(obj).forEach(function(key) {
+					keys = key.split(".");
+					val = obj[key];
+					data = that.$data;
+					keys.forEach(function(key2, index) {
+						if (index + 1 == keys.length) {
+							that.$set(data, key2, val);
+						} else {
+							if (!data[key2]) {
+								that.$set(data, key2, {});
+							}
+						}
+						data = data[key2];
 					});
 				});
 			},
-			appCreate(app) { //鐐瑰嚮鍔熻兘鐐硅烦杞〉闈�-				console.log(app);
-				var paramStr = this.$store.state.OIMoboxSAPI ? app.param : app.Param;
-				var appName = this.$store.state.OIMoboxSAPI ? (app.name || app.list_name) : app.Name;
-				var defCode = this.$store.state.OIMoboxSAPI ? app.def_code : app.DefCode;
+
+			async loadData() {
+				try {
+					this.setData({
+						data: []
+					})
+					const appType = utils.session.getValue('app_type') || "MES";
+					const list = await areaFunc(appType, 1) || []
+					const app = getApp()
+					if (this.isMobox3) {
+						const list2 = []
+						for (let i in list) {
+							const area = list[i]
+							area.app_type = appType
+							const areaApp = await this.GetFuncTree(i, area)
+							console.log(areaApp)
+							if (areaApp) {
+								list2.push(areaApp)
+							}
+						}
+						this.setData({
+							data: list2
+						})
+					} else {
+						this.setData({
+							data: list
+						})
+					}
+				} catch (ex) {
+					console.log(ex);
+					let exStr = JSON.stringify(ex)
+					if (exStr == "{}")
+						exStr = ex
+					let tip = typeof ex.errMsg == "string" ? ex.errMsg : exStr
+					uni.showModal({
+						title: this.translateSys("error"),
+						content: tip,
+						showCancel: false,
+						confirmText: this.translateSys('close')
+					});
+				}
+
+
+			},
+			async GetFuncTree(index, area) { //Mobox3鑾峰彇搴旂敤棰嗗煙鐨勫姛鑳界偣		
+				try {
+					var param = {
+						app_type: area.app_type,
+						area_id: area.id,
+						area_client_type: area.client_type,
+						need_ace: 1,
+					};
+					const res = await getFuncTree(param) || []
+					if (res.length > 0)
+						return res[0]
+					else
+						return undefined
+				} catch (ex) {
+					console.log(ex);
+					let exStr = JSON.stringify(ex)
+					if (exStr == "{}")
+						exStr = ex
+					let tip = typeof ex.errMsg == "string" ? ex.errMsg : exStr
+					uni.showModal({
+						title: this.translateSys("error"),
+						content: tip,
+						showCancel: false,
+						confirmText: this.translateSys('close')
+					});
+					return undefined
+				}
+			},
+			onClickApp(appInfo) {
+				this.handleButtonClick((done) => {
+					this.appCreate(appInfo)
+					setTimeout(() => {
+						done(); // 閲嶇疆鐘舵�
+					}, 1000);
+				});
+
+			},
+			appCreate(appInfo) { //鐐瑰嚮鍔熻兘鐐硅烦杞〉闈�+				console.log(appInfo);
+				const app = getApp()
+
+				var paramStr = this.isMobox3 ? appInfo.param : appInfo.Param;
+				var appName = this.isMobox3 ? (appInfo.list_name || appInfo.name) : appInfo.Name;
+				var defCode = this.isMobox3 ? appInfo.def_code : appInfo.DefCode;
 				var param = "";
 				if (paramStr) {
 					//mobox2鐨刾aram鏄痡son瀛楃涓�@@ -139,18 +182,18 @@
 					//mobox3鐨刾aram鏄痓ase64瀛楃涓� 					if (!paramStr.includes('"')) param = Base64.decode(paramStr);
 				}
-		
+
 				if (!param) {
 					uni.showModal({
 						title: this.translateSys("tip"),
-						content:this.translate('tip_no_app_param'),
+						content: this.translate('tip_no_app_param'),
 						showCancel: false,
-						confirmText:this.translateSys("cancel")
+						confirmText: this.translateSys('close')
 					});
 					return;
 				}
 				if (defCode == '3018') {
-					if (this.$store.state.OIMoboxSAPI) { //Mobox3
+					if (this.isMobox3) { //Mobox3
 						uni.navigateTo({
 							// url:'../modal/3018?param='+param+"&titlename="+appName
 							url: '../modal/3018_2?param=' + param + "&titlename=" + appName
@@ -161,7 +204,7 @@
 						});
 					}
 				} else if (defCode == '3037') {
-					if (this.$store.state.OIMoboxSAPI) { //Mobox3
+					if (this.isMobox3) { //Mobox3
 						uni.navigateTo({
 							// url:'../modal/3037?param='+param+"&titlename="+appName
 							url: '../modal/3037_2?param=' + param + "&titlename=" + appName
@@ -172,31 +215,37 @@
 						});
 					}
 				} else if (defCode == '3200') {
-					if (this.$store.state.OIMoboxSAPI) { //Mobox3
+					if (this.isMobox3) { //Mobox3
 						uni.navigateTo({
 							url: '../modal/3200?param=' + param + "&titlename=" + appName
 						});
 					}
 				} else if (defCode == '3201') {
-					if (this.$store.state.OIMoboxSAPI) { //Mobox3
+					if (this.isMobox3) { //Mobox3
 						uni.navigateTo({
 							url: '../modal/3201?param=' + param + "&titlename=" + appName
 						});
 					}
+				} else if (defCode == '3202') {
+					if (this.isMobox3) { //Mobox3
+						uni.navigateTo({
+							url: '../modal/3202?param=' + param + "&titlename=" + appName
+						});
+					}
 				} else if (defCode == '5600') { //鐮佺洏
-					if (this.$store.state.OIMoboxSAPI) { //Mobox3
+					if (this.isMobox3) { //Mobox3
 						uni.navigateTo({
 							url: '../modal/5600?param=' + param + "&titlename=" + appName
 						});
 					}
 				} else if (defCode == '5601') { //鐮佺洏
-					if (this.$store.state.OIMoboxSAPI) { //Mobox3
+					if (this.isMobox3) { //Mobox3
 						uni.navigateTo({
 							url: '../modal/5601?param=' + param + "&titlename=" + appName
 						});
 					}
 				} else if (defCode == '5602') { //鍒嗘嫞
-					if (this.$store.state.OIMoboxSAPI) { //Mobox3
+					if (this.isMobox3) { //Mobox3
 						uni.navigateTo({
 							url: '../modal/5602?param=' + param + "&titlename=" + appName
 						});
@@ -211,7 +260,7 @@
 				// console.log(e.target)
 				getApp().onScan((result) => {
 					// console.log(result.decodedata);
-					this.$data.data[e.target.dataset['key']] = result.decodedata;
+					this.data[e.target.dataset['key']] = result.decodedata;
 				})
 			},
 			translate(t) {
@@ -228,35 +277,71 @@
 
 <style lang="scss">
 	.uni-page-index {
-
-		width: 100vw;
-		min-height: 100vh;
+		width: 750rpx;
+		height: 100vh;
 		background: #EAEAEA;
-		padding: 1rpx 0rpx;
+		display: flex;
 
+		.area-list {
+			width: 100%;
+			height: 100%;
+			display: flex;
+			flex-direction: column;
+			overflow-y: auto;
 
-		.v-area {
-			border-radius: 12rpx;
-			margin: 30rpx;
-			padding: 10rpx;
-			background: #FFFFFF;
+			.v-area {
+				border-radius: 12rpx;
+				margin: 10rpx;
+				padding: 10rpx;
+				background: #FFFFFF;
+				display: flex;
+				flex-direction: column;
+				width: calc(100% - 40rpx);
+
+				.area-name {
+					width: 100%;
+					padding: 10rpx;
+				}
+
+				.app-list {
+					width: 100%;
+					padding: 0;
+					display: flex;
+					flex-direction: row;
+					flex-wrap: wrap;
+
+					.app {
+						padding: 20rpx 25rpx 15rpx 25rpx;
+						text-align: center;
+						width: 125rpx;
+						display: flex;
+						flex-direction: column;
+
+						.logo {
+							height: 105rpx;
+							width: 105rpx;
+							border-radius: 20rpx;
+							padding: 10rpx;
+							color: #000000;
+							border: 0px solid rgb(221, 221, 221);
+
+							.ico {
+								color: #000000;
+								line-height: 105rpx;
+								font-size: 24px;
+							}
+						}
+
+						.app-name {
+							padding-top: 10rpx;
+						}
+					}
+				}
+			}
+
 		}
 
-		.areaList {
-			padding: 0;
-		}
 
-		.areaList li {
-			/* border: 1px solid #0062CC; */
-			list-style: none;
-			/* width: 120rpx; */
-			display: inline-block;
-			padding: 30rpx 10rpx 16rpx 10rpx;
-			text-align: center;
-			font-size: 14px;
-			width: 100px;
-			vertical-align: text-top;
-		}
 
 		.logo {
 			height: 120rpx;
@@ -269,10 +354,31 @@
 			border: 0px solid rgb(221, 221, 221);
 		}
 
-		.logo i {
-			color: #000000;
-			font-size: 40px;
-			line-height: 53px;
+	}
+
+	.uni-page-index.large-mode {
+		.area-name {
+			font-size: 30px;
 		}
+
+		.app {
+			padding: 20rpx 25rpx 15rpx 25rpx;
+			width: 175rpx  !important;
+
+			.logo {
+				height: 150rpx  !important;
+				width: 150rpx  !important;
+
+				.ico {
+					line-height: 150rpx  !important;
+					font-size: 30px  !important;
+				}
+			}
+
+			.app-name {
+				padding-top: 10rpx !important;
+			}
+		}
+
 	}
 </style>
\ No newline at end of file

--
Gitblit v1.9.1