| | |
| | | <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.list_name|| app.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 { |
| | | const appType = utils.session.getValue('app_type') || "MES"; |
| | | this.$store.dispatch('areaFunc', { |
| | | app_type: appType |
| | | }).then(success => { |
| | | // console.log(success); |
| | | if (success.code == '00000' || success.err_code == 0) { |
| | | this.data = success.data; |
| | | if (success.err_code != undefined) { //判断是否是Mobox3 |
| | | success.result.forEach(async (area, index) => { |
| | | if (area.client_type == 2) { //判断类型是否是PDA类型 |
| | | area.app_type= appType |
| | | 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; |
| | | setData: function(obj) { |
| | | let that = this; |
| | | let keys = []; |
| | | let val, data; |
| | | |
| | | var json = { |
| | | app_type: area.app_type, |
| | | 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); |
| | | 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, {}); |
| | | } |
| | | } |
| | | |
| | | } 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") |
| | | 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.list_name || app.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的param是json字符串 |
| | |
| | | title: this.translateSys("tip"), |
| | | 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 |
| | |
| | | }); |
| | | } |
| | | } 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 |
| | |
| | | }); |
| | | } |
| | | } 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 |
| | | }); |
| | |
| | | // uni.redirectTo({ |
| | | // url:'../index/index?args=9999999999' |
| | | // }); |
| | | }, |
| | | ontap(e) { //扫码功能 |
| | | // console.log(e.target) |
| | | getApp().onScan((result) => { |
| | | // console.log(result.decodedata); |
| | | this.$data.data[e.target.dataset['key']] = result.decodedata; |
| | | }) |
| | | }, |
| | | translate(t) { |
| | | if (typeof this.$t == "function") return this.$t(`page.${t}`) |
| | |
| | | |
| | | <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; |
| | |
| | | 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> |