409 lines
9.2 KiB
Vue
409 lines
9.2 KiB
Vue
|
<template>
|
|||
|
|
|
|||
|
|
<view class="work-container" style="">
|
|||
|
|
|
|||
|
|
<!-- <uni-nav-bar shadow right-icon="plusempty" @clickRight="rightClick" :fixed="true" :shadow="false"
|
|||
|
|
:border="false" title="工作台" /> -->
|
|||
|
|
<u-sticky>
|
|||
|
|
<!-- <view style="display: flex; width: 100vw;position: absolute;z-index: 1;"> -->
|
|||
|
|
<uni-search-bar style="width: 100%;position: absolute;top: 10px;" bgColor="#FFFFFF" placeholder="请输入搜索内容"
|
|||
|
|
ref="searchBar" cancelButton="none" @focus="goSearchClick" />
|
|||
|
|
<!-- </view> -->
|
|||
|
|
</u-sticky>
|
|||
|
|
<u-back-top :scroll-top="scrollTop" style="bottom: 100px;"></u-back-top>
|
|||
|
|
<view class="uni-flex uni-column">
|
|||
|
|
<view class="flex-item flex-item-V">
|
|||
|
|
<image :src="src" mode="aspectFill" style="width: 100%;height: 200rpx;" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view v-for="(item, index) in datalist" :key="index">
|
|||
|
|
<u-grid v-if="shouldShowGrid(item.data)" :border="false" col="4"
|
|||
|
|
style="background-color: #fff;margin: 10px 0;border-radius: 3px;">
|
|||
|
|
<uni-title type="h3" :title="item.name" style="margin: 10px 10px;width: 100%;flex: auto;"></uni-title>
|
|||
|
|
<u-grid-item v-for="(data,dataIndex) in item.data" :key="dataIndex" @click="selectgrid(data)"
|
|||
|
|
v-if="checkPermi([data.permission])">
|
|||
|
|
<uni-icons v-if="data.icon.includes('icon')" class="uni-icons"
|
|||
|
|
:style="{'background': data.color,'-webkit-background-clip': 'text','-webkit-text-fill-color': 'transparent',}"
|
|||
|
|
custom-prefix="iconfont" :type="data.icon" color="transparent" size="30" />
|
|||
|
|
<uni-icons v-else class="uni-icons" :type="data.icon"
|
|||
|
|
:style="{'background': data.color,'-webkit-background-clip': 'text','-webkit-text-fill-color': 'transparent'}"
|
|||
|
|
color="transparent" size="30" />
|
|||
|
|
<text class="text">{{data.style.navigationBarTitleText}}</text>
|
|||
|
|
</u-grid-item>
|
|||
|
|
</u-grid>
|
|||
|
|
</view>
|
|||
|
|
<!-- <u-picker :show="showMenu" @close="Menuclose" @confirm="confirm" @cancel="cancel" :columns="columns"
|
|||
|
|
:closeOnClickOverlay="true"></u-picker> -->
|
|||
|
|
<u-action-sheet :actions="columns" @select="confirm" cancelText="取消" @close="cancel" title="请选择模式"
|
|||
|
|
:show="showMenu" :closeOnClickOverlay="true"></u-action-sheet>
|
|||
|
|
<u-action-sheet :actions="list" @select="selectTask" cancelText='取消' @close="close" :closeOnClickOverlay="true"
|
|||
|
|
:closeOnClickAction="true" description='请选择任务' :show="show"></u-action-sheet>
|
|||
|
|
<u-action-sheet :actions="invQuicklist" @select="selectTask" cancelText='取消' @close="invQuickclose"
|
|||
|
|
:closeOnClickOverlay="true" :closeOnClickAction="true" description='请选择盘点类型'
|
|||
|
|
:show="invQuickshow"></u-action-sheet>
|
|||
|
|
|
|||
|
|
<!-- <view>
|
|||
|
|
<u-sticky>
|
|||
|
|
<u-tabs
|
|||
|
|
:current="currentTab"
|
|||
|
|
:list="datalist"
|
|||
|
|
@click="handleTabClick"
|
|||
|
|
></u-tabs>
|
|||
|
|
</u-sticky>
|
|||
|
|
|
|||
|
|
<view v-for="(item, index) in datalist" :key="index"> -->
|
|||
|
|
<!-- 锚点内容 -->
|
|||
|
|
<!-- <view :id="'section'+index" class="section">
|
|||
|
|
<view class="grid-body" style="background-color: #fff;margin: 10px 0;border-radius: 3px;">
|
|||
|
|
<uni-title type="h3" :title="item.name" style="margin-left: 10px;"></uni-title>
|
|||
|
|
<uni-grid :column="4" :showBorder="false" @change="changeGrid10" :open="true" v-for="(data,dataIndex) in item.data">
|
|||
|
|
<uni-grid-item :index="dataIndex+1" >
|
|||
|
|
<view class="grid-item-box" style="">
|
|||
|
|
<uni-icons class="uni-icons" custom-prefix="iconfont" :type="data.icon" :color="data.color" size="30"></uni-icons>
|
|||
|
|
</view>
|
|||
|
|
<text class="text">{{data.style.navigationBarTitleText}}</text>
|
|||
|
|
</uni-grid-item>
|
|||
|
|
</uni-grid>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
version
|
|||
|
|
} from "vue"
|
|||
|
|
import datalist from "./indexList.json"
|
|||
|
|
import {
|
|||
|
|
checkPermi,
|
|||
|
|
checkRole
|
|||
|
|
} from "@/utils/permission";
|
|||
|
|
export default {
|
|||
|
|
mounted() {
|
|||
|
|
// #ifdef APP-PLUS
|
|||
|
|
var version = plus.runtime.version;
|
|||
|
|
// #endif
|
|||
|
|
},
|
|||
|
|
components: {},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
invQuickshow: false,
|
|||
|
|
showMenu: false,
|
|||
|
|
scrollTop: 0,
|
|||
|
|
src: '/static/images/banner/mes_banner.jpg',
|
|||
|
|
datalist: datalist,
|
|||
|
|
show: false,
|
|||
|
|
list: [{
|
|||
|
|
name: '保养任务',
|
|||
|
|
path: '/pages/tpm/maintainTask'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '点检任务',
|
|||
|
|
path: '/pages/tpm/checkTask'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '维修任务',
|
|||
|
|
path: '/pages/tpm/repairTask'
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
invQuicklist: [{
|
|||
|
|
name: '快速盘点',
|
|||
|
|
path: '/pages/wms/stock/addInvQuick?key=1'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '期初盘点',
|
|||
|
|
path: '/pages/wms/stock/addInvQuick?key=2'
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
// 右边菜单内容
|
|||
|
|
options: [{
|
|||
|
|
value: 'update',
|
|||
|
|
text: '选修'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value: 'forbit',
|
|||
|
|
text: '禁止'
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
// columns: [
|
|||
|
|
// ['常规功能', 'MES智能终端']
|
|||
|
|
// ],
|
|||
|
|
columns: [{
|
|||
|
|
name: '常规功能',
|
|||
|
|
path: '/pages/work/index'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: 'MES智能终端',
|
|||
|
|
path: '/pages/work/mesIT'
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onPageScroll(e) {
|
|||
|
|
this.scrollTop = e.scrollTop;
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
shouldShowGrid(dataList) {
|
|||
|
|
for (const data of dataList) {
|
|||
|
|
if (this.checkPermi([data.permission])) {
|
|||
|
|
return true; // 如果有一个u-grid-item可以显示，则显示u-grid
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return false; // 如果没有一个u-grid-item可以显示，则不显示u-grid
|
|||
|
|
},
|
|||
|
|
checkPermi,
|
|||
|
|
Menuclose() {
|
|||
|
|
this.showMenu = false
|
|||
|
|
},
|
|||
|
|
confirm(e) {
|
|||
|
|
console.log(e)
|
|||
|
|
// if (e.value == '常规功能') {
|
|||
|
|
// this.$tab.reLaunch('/pages/work/index');
|
|||
|
|
// } else if (e.value == 'MES智能终端') {
|
|||
|
|
// this.$tab.reLaunch('/pages/work/mesIT');
|
|||
|
|
// }
|
|||
|
|
this.$tab.reLaunch(e.path);
|
|||
|
|
},
|
|||
|
|
cancel() {
|
|||
|
|
this.showMenu = false
|
|||
|
|
},
|
|||
|
|
onNavigationBarButtonTap(e) {
|
|||
|
|
console.log(e)
|
|||
|
|
this.showMenu = !this.showMenu;
|
|||
|
|
},
|
|||
|
|
rightClick() {
|
|||
|
|
console.log('rightClick');
|
|||
|
|
},
|
|||
|
|
selectgrid(item) {
|
|||
|
|
if (item) {
|
|||
|
|
if (item.path) {
|
|||
|
|
this.$tab.navigateTo(item.path);
|
|||
|
|
} else if (item.style.navigationBarTitleText == '任务查看') {
|
|||
|
|
this.show = true;
|
|||
|
|
} else if (item.style.navigationBarTitleText == '新增快速盘点') {
|
|||
|
|
this.invQuickshow = true;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
goSearchClick() {
|
|||
|
|
this.$tab.navigateTo("/pages/work/searchIndex/searchIndex");
|
|||
|
|
},
|
|||
|
|
selectTask(e) {
|
|||
|
|
console.log(e);
|
|||
|
|
this.$tab.navigateTo(e.path);
|
|||
|
|
},
|
|||
|
|
close() {
|
|||
|
|
this.show = false;
|
|||
|
|
},
|
|||
|
|
invQuickclose() {
|
|||
|
|
this.invQuickshow = false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
.menu {
|
|||
|
|
position: fixed;
|
|||
|
|
top: 44px;
|
|||
|
|
right: 0;
|
|||
|
|
width: 120px;
|
|||
|
|
background-color: #fff;
|
|||
|
|
border: 1px solid #ccc;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.wrap {
|
|||
|
|
height: 200vh;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.work-container {
|
|||
|
|
// background: white;
|
|||
|
|
min-height: 50vh;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tabs {
|
|||
|
|
position: sticky;
|
|||
|
|
z-index: 970;
|
|||
|
|
top: 0px;
|
|||
|
|
background-color: #fff;
|
|||
|
|
width: 100vw;
|
|||
|
|
|
|||
|
|
.tabsStyle {
|
|||
|
|
box-shadow: 0 2rpx 6rpx 0 rgba(153, 153, 153, 0.2);
|
|||
|
|
|
|||
|
|
::v-deep {
|
|||
|
|
.u-tabs {
|
|||
|
|
box-shadow: 0px 4px 6px 0 rgba(153, 153, 153, 0.2);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* #ifndef APP-NVUE */
|
|||
|
|
page {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
// background-color: #fff;
|
|||
|
|
min-height: 100%;
|
|||
|
|
height: auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
view {
|
|||
|
|
// font-size: 20px;
|
|||
|
|
line-height: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* #endif */
|
|||
|
|
|
|||
|
|
.text {
|
|||
|
|
text-align: center;
|
|||
|
|
// font-size: 30rpx;
|
|||
|
|
margin-top: 10px;
|
|||
|
|
// color: #fff;
|
|||
|
|
position: relative;
|
|||
|
|
bottom: 10px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.grid-item-box {
|
|||
|
|
flex: 1;
|
|||
|
|
/* #ifndef APP-NVUE */
|
|||
|
|
display: flex;
|
|||
|
|
/* #endif */
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
// padding: 15px 0;
|
|||
|
|
margin: 10px 21px;
|
|||
|
|
// background-color: #0F6C8E;
|
|||
|
|
border-radius: 7px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
.uni-margin-wrap {
|
|||
|
|
width: 690rpx;
|
|||
|
|
width: 100%;
|
|||
|
|
;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.swiper {
|
|||
|
|
height: 300rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.swiper-box {
|
|||
|
|
height: 150px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.swiper-item {
|
|||
|
|
/* #ifndef APP-NVUE */
|
|||
|
|
display: flex;
|
|||
|
|
/* #endif */
|
|||
|
|
flex-direction: column;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
color: #fff;
|
|||
|
|
height: 300rpx;
|
|||
|
|
line-height: 300rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
@media screen and (min-width: 320px) {
|
|||
|
|
.uni-swiper-dot-box {
|
|||
|
|
width: 400px;
|
|||
|
|
/* #ifndef APP-NVUE */
|
|||
|
|
margin: 0 auto;
|
|||
|
|
/* #endif */
|
|||
|
|
margin-top: 8px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.image {
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//竖屏
|
|||
|
|
@media screen and (min-width: 600px) and (orientation:portrait) {
|
|||
|
|
.grid-item-box {
|
|||
|
|
margin: 20px 40px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.text {
|
|||
|
|
bottom: 10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.uni-icons {
|
|||
|
|
font-size: 50px !important;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//横屏
|
|||
|
|
@media screen and (min-width: 600px) and (orientation:landscape) {
|
|||
|
|
// .uni-swiper-dot-box {
|
|||
|
|
// width: 400px;
|
|||
|
|
// /* #ifndef APP-NVUE */
|
|||
|
|
// margin: 0 auto;
|
|||
|
|
// /* #endif */
|
|||
|
|
// margin-top: 8px;
|
|||
|
|
// }
|
|||
|
|
|
|||
|
|
.image {
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.grid-item-box {
|
|||
|
|
margin: 50px 70px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.text {
|
|||
|
|
bottom: 10px;
|
|||
|
|
font-size: 24px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.uni-icons {
|
|||
|
|
font-size: 60px !important;
|
|||
|
|
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .uni-btn-icon {
|
|||
|
|
font-size: 60px !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .uniui-search {
|
|||
|
|
font-size: 40px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .uni-h3 {
|
|||
|
|
font-size: 24px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .uni-searchbar__box {
|
|||
|
|
height: 50px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
::v-deep.uni-searchbar__text-placeholder {
|
|||
|
|
font-size: 24px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .u-action-sheet__header__title {
|
|||
|
|
font-size: 24px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
::v-deep .u-icon__icon .uicon-close {
|
|||
|
|
font-size: 35px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep.u-action-sheet__item-wrap__item__name {
|
|||
|
|
font-size: 24px
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.u-action-sheet__cancel-text {
|
|||
|
|
font-size: 24px
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|