| | |
| | | <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 |
| | |
| | | import { |
| | | getFuncTree |
| | | } from "@/api/mobox.js" |
| | | import buttonClickMixin from '@/mixins/button-click.js'; |
| | | |
| | | export default { |
| | | modules: { |
| | | Base64, |
| | | }, |
| | | mixins: [buttonClickMixin], |
| | | onNavigationBarButtonTap(e) { |
| | | 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)的引用领域功能点信息 |
| | | |
| | | this.loadData() |
| | | |
| | | }, |
| | |
| | | const appType = utils.session.getValue('app_type') || "MES"; |
| | | const list = await areaFunc(appType, 1) || [] |
| | | const app = getApp() |
| | | if (app.globalData.isMobox3) { |
| | | if (this.isMobox3) { |
| | | const list2 = [] |
| | | for (let i in list) { |
| | | const area = list[i] |
| | |
| | | title: this.translateSys("error"), |
| | | content: tip, |
| | | showCancel: false, |
| | | confirmText: this.translateSys("cancel") |
| | | confirmText: this.translateSys('close') |
| | | }); |
| | | } |
| | | |
| | |
| | | title: this.translateSys("error"), |
| | | content: tip, |
| | | showCancel: false, |
| | | confirmText: this.translateSys("cancel") |
| | | 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 = app.globalData.isMobox3 ? appInfo.param : appInfo.Param; |
| | | var appName = app.globalData.isMobox3 ? (appInfo.list_name || appInfo.name) : appInfo.Name; |
| | | var defCode = app.globalData.isMobox3 ? appInfo.def_code : appInfo.DefCode; |
| | | 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 (app.globalData.isMobox3) { //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 (app.globalData.isMobox3) { //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 (app.globalData.isMobox3) { //Mobox3 |
| | | if (this.isMobox3) { //Mobox3 |
| | | uni.navigateTo({ |
| | | url: '../modal/3200?param=' + param + "&titlename=" + appName |
| | | }); |
| | | } |
| | | } else if (defCode == '3201') { |
| | | if (app.globalData.isMobox3) { //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 (app.globalData.isMobox3) { //Mobox3 |
| | | if (this.isMobox3) { //Mobox3 |
| | | uni.navigateTo({ |
| | | url: '../modal/5600?param=' + param + "&titlename=" + appName |
| | | }); |
| | | } |
| | | } else if (defCode == '5601') { //码盘 |
| | | if (app.globalData.isMobox3) { //Mobox3 |
| | | if (this.isMobox3) { //Mobox3 |
| | | uni.navigateTo({ |
| | | url: '../modal/5601?param=' + param + "&titlename=" + appName |
| | | }); |
| | | } |
| | | } else if (defCode == '5602') { //分拣 |
| | | if (app.globalData.isMobox3) { //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> |