<template>
|
<view>
|
<!-- <u-navbar back-text=""xi title="首页" :custom-back="back"></u-navbar> -->
|
<view margin="0rpx">
|
<view class="" v-for="(item,index) in title" :key="index">
|
<view class="title">
|
{{item}}
|
</view>
|
<view class="con">
|
<view v-for="(i,value) in perList" :key="value">
|
<view v-if="item == i.name" class="name" @click="go(i.color)">
|
<view class="iconBg" :class="i.color">
|
<u-badge v-if="i.count" :count="count" :offset="[-15, -15]"></u-badge>
|
<text class="txt txt1">{{i.title.substr(0,1)}}</text>
|
</view>
|
<view class="grid-text">{{i.title}}</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
<u-card margin="0rpx" title="">
|
<view class="loginBtnP" style="padding: 2rem 0 1rem 0;" slot="body">
|
<view class="loginBtn" @click="blue">
|
打印机设置
|
</view>
|
<view class="loginBtn" @click="onPrint">
|
测试打印
|
</view>
|
</view>
|
</u-card>
|
|
</view>
|
</template>
|
|
<script>
|
import {
|
SearchNum
|
} from '../../api/task.js'
|
import {
|
Permission
|
} from '../../api/home.js'
|
import mixBule from '@/mixins/Blue.js'
|
export default {
|
data() {
|
return {
|
stateText: '合格',
|
cvi: 'CI202206061612040685',
|
containerCode: 'P71-1769-001',
|
type: 'EU箱入立体库',
|
palletType: 'H库：2200x1400x1000',
|
count: '4',
|
perList: [],
|
title: [],
|
titleList: [{
|
color: 'green1',
|
pages: '../PutIn/jimo/jimo'
|
},
|
{
|
color: 'brown1',
|
pages: '../PutOut/plan/plan'
|
},
|
{
|
color: 'blue1',
|
pages: '../PutOut/manual/manual'
|
},
|
{
|
color: 'red1',
|
pages: '../PutOut/task/task'
|
},
|
{
|
color: 'violet1',
|
pages: '../PutOut/operation/operation'
|
}
|
],
|
singlist: [
|
{
|
createLine: "李沧A线乙班",
|
itemDes: "前风窗下外板,5301211-H55,200",
|
itemName: "无,无,无",
|
itemNum: "无,无,无",
|
updateTime: "2022-06-06 16:13:57"
|
},
|
],
|
};
|
},
|
mixins: [mixBule],
|
onShow() {
|
this.SearchNum()
|
this.Permission()
|
},
|
mounted() {},
|
onBackPress(e) {
|
// 这里可以自定义返回逻辑，比如下面跳转其他页面
|
uni.switchTab({
|
url: '../Login/index'
|
});
|
// return true 表示禁止默认返回
|
return true
|
},
|
watch: {
|
count(newVal, oldVal) {
|
if (newVal > oldVal) {
|
this.Permission()
|
}
|
}
|
|
},
|
methods: {
|
//语音播报
|
playSound() {
|
this.wakeLock()
|
let _this = this
|
// _this.playing = true
|
const innerAudioContext = uni.createInnerAudioContext();
|
innerAudioContext.autoplay = true;
|
innerAudioContext.src = '../../../static/musice/13716.wav';
|
innerAudioContext.onError((res) => {
|
//如果音频没有正常播放
|
console.log(res.errCode);
|
})
|
innerAudioContext.onStop((res) => {
|
_this.playing = false
|
|
_this.$forceUpdate()
|
})
|
},
|
//权限
|
Permission() {
|
let soundflag = false
|
let params = {
|
roleName: uni.getStorageSync('roleName')
|
}
|
Permission(params).then((res) => {
|
this.title = []
|
this.perList = res
|
this.perList.forEach((item) => {
|
//1.定义一个数组存放标题，该数组会有重复所以需要去重
|
this.title.push(item.name);
|
if (item.title == '搬运任务') {
|
this.$set(item, 'count', this.count)
|
if (item.count && item.count !== '0') {
|
soundflag = true
|
}
|
}
|
});
|
//2.去重
|
this.title = this.title.filter((currentValue, index) => {
|
return this.title.indexOf(currentValue) == index;
|
});
|
})
|
if (soundflag) {
|
this.playSound()
|
}
|
},
|
//跳转页面
|
go(i) {
|
this.titleList.forEach(item => {
|
if (i == item.color) {
|
uni.navigateTo({
|
url: item.pages
|
});
|
}
|
})
|
},
|
// 角标数量
|
SearchNum() {
|
let params = {
|
userName: uni.getStorageSync("admin"),
|
taskStatusNot: '完成'
|
}
|
SearchNum(params).then((res) => {
|
this.count = res
|
})
|
},
|
//补打标签页面
|
blue() {
|
uni.navigateTo({
|
url: './searchBlue'
|
});
|
},
|
//测试打印
|
onPrint() {
|
if (!uni.getStorageSync("deviceId")) {
|
uni.showToast({
|
title: '请连接打印机',
|
icon: 'error',
|
duration: 2000
|
})
|
return
|
}
|
this.writeBLECharacteristicValue()
|
},
|
}
|
}
|
</script>
|
<style lang="scss">
|
page {
|
// background-color: #c3c3c3;
|
}
|
|
.title {
|
border: 1px solid #eaeaea;
|
padding: 10px;
|
font-size: 1rem;
|
}
|
|
.con {
|
display: flex;
|
flex-wrap: wrap;
|
|
.name {
|
margin: 0 auto;
|
width: 7.5rem;
|
text-align: center;
|
height: 5.2rem;
|
border-right: 1px solid #eaeaea;
|
border-bottom: 1px solid #eaeaea;
|
padding: 10px 0 0;
|
}
|
}
|
|
//任务管理按钮
|
.loginBtnP {
|
width: 100%;
|
padding: 15px 0 55px 0 !important;
|
}
|
|
.loginBtn {
|
width: 90%;
|
padding: 0.73rem;
|
background-color: #26a53f;
|
border-radius: 0.5rem;
|
color: white;
|
margin: 0 auto 15px;
|
text-align: center;
|
font-size: 1.1rem;
|
}
|
|
.iconBg {
|
margin-bottom: 5px;
|
font-size: 1.2rem;
|
color: white;
|
display: inline-block;
|
border-radius: 25px;
|
line-height: 20px;
|
width: 40px;
|
height: 40px;
|
padding: 5px;
|
position: relative;
|
cursor: pointer;
|
font-weight: 500;
|
text-decoration: none;
|
white-space: nowrap;
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(5%, #f5a3a0), color-stop(5%, #ff0066), color-stop(100%, #ff6600));
|
transition: background-color 0.2s ease-out;
|
border-radius: 8px;
|
|
.txt {
|
position: absolute;
|
top: 10px;
|
left: 5px;
|
width: 30px;
|
height: 30px;
|
z-index: 100;
|
display: block;
|
|
&.color {
|
text-transform: uppercase;
|
background-image: linear-gradient(to right, orangered, orange, gold, lightgreen, cyan, dodgerblue, mediumpurple, hotpink, orangered);
|
-webkit-background-clip: text;
|
-webkit-text-fill-color: transparent;
|
color: white;
|
background-size: 30px;
|
}
|
|
&.txt1 {
|
background-size: 40px;
|
animation: sliding1 30s linear infinite;
|
}
|
|
&.txt2 {
|
background-size: 40px;
|
animation: sliding 20s linear infinite;
|
}
|
}
|
|
&.green1 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #68ea68),
|
color-stop(5%, #127e12),
|
color-stop(100%, #1aad19));
|
border: 1px solid #0f680f;
|
color: white !important;
|
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 20px;
|
height: 20px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #127812;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
|
&.red1 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #f5a3a0),
|
color-stop(5%, #ff0066),
|
color-stop(100%, #ff6600));
|
border: 1px solid #da0d0d;
|
color: white !important;
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 20px;
|
height: 20px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #da0d0d;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
|
&.blue1 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #d7d7ff),
|
color-stop(5%, #0000b9),
|
color-stop(100%, #3333ff));
|
border: 1px solid #3333ff;
|
color: white !important;
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 20px;
|
height: 20px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #3333ff;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
|
&.brown1 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #ff5757),
|
color-stop(5%, #f90000),
|
color-stop(100%, #990000));
|
border: 1px solid #990000;
|
color: white !important;
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 20px;
|
height: 20px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #990000;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
|
&.violet1 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #cc99cc),
|
color-stop(5%, #663366),
|
color-stop(100%, #5e00bb));
|
border: 1px solid #330066;
|
color: white !important;
|
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 20px;
|
height: 20px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #7d00fb;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
|
&.black1 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #bfbfbf),
|
color-stop(5%, #484848),
|
color-stop(100%, #999999));
|
border: 1px solid #999999;
|
color: white !important;
|
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 30px;
|
height: 30px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #484848;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
|
&.blue2 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #00c4c4),
|
color-stop(5%, #009797),
|
color-stop(100%, #00dddd));
|
border: 1px solid #009797;
|
color: white !important;
|
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 30px;
|
height: 30px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #00cccc;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
|
&.brown2 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #00c4c4),
|
color-stop(5%, #009797),
|
color-stop(100%, #9933ff));
|
border: 1px solid #009797;
|
color: white !important;
|
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 30px;
|
height: 30px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #00cccc;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
|
&.violet2 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #cfc003),
|
color-stop(5%, #7e730e),
|
color-stop(100%, #b8aa03));
|
border: 1px solid #83770e;
|
color: white !important;
|
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 30px;
|
height: 30px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #b7a713;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
|
&.green2 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #1dcb1d),
|
color-stop(5%, #127e12),
|
color-stop(100%, #a5bb0b));
|
border: 1px solid #17a217;
|
color: white !important;
|
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 30px;
|
height: 30px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #18a518;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
|
&.red2 {
|
background-image: -webkit-gradient(linear,
|
left top,
|
left bottom,
|
color-stop(5%, #f5a3a0),
|
color-stop(5%, #ff0066),
|
color-stop(100%, #ff6600));
|
border: 1px solid #da0d0d;
|
color: white !important;
|
|
&::after {
|
position: absolute;
|
top: 5px;
|
left: 5px;
|
width: 30px;
|
height: 30px;
|
z-index: 0;
|
border-radius: 4em;
|
background-color: #da0d0d;
|
content: " ";
|
display: block;
|
padding: 5px;
|
}
|
}
|
}
|
|
.green {
|
background-image: linear-gradient(to bottom, #0d660d, #128210);
|
}
|
|
.ji {
|
// background-image: linear-gradient(to right, #04967e,#206169, #c64407);
|
// -webkit-background-clip: text;
|
// -webkit-text-fill-color: transparent;
|
animation: sliding1 30s linear infinite;
|
}
|
|
.grid-text {
|
font-size: 28rpx;
|
margin-top: 4rpx;
|
color: $u-type-info;
|
}
|
|
/deep/.u-card__body {
|
padding: 0 !important;
|
}
|
|
@keyframes sliding {
|
to {
|
background-position: -100px;
|
}
|
}
|
|
@keyframes sliding1 {
|
to {
|
background-position: -150px;
|
}
|
}
|
</style>
|
