合并代码
This commit is contained in:
parent
13ea567bb4
commit
cd6b44efe6
|
|
@ -1,694 +0,0 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="home">
|
||||
<image class="all-home" src="/static/index/warehouse/newhome/setting.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="paizi tp" @click="ceshi">
|
||||
<donghua width="18vw" height="18vw" :interval="300" :links="paiziarray" :playing="playall" :loop="true" />
|
||||
</view>
|
||||
<view class="jiankong tp" @click="back">
|
||||
<donghua width="17vw" height="17vw" :interval="300" :links="jiankongarray" :playing="playall"
|
||||
:loop="true" />
|
||||
</view>
|
||||
<view class="wanjie tp">
|
||||
<donghua width="18vw" height="18vw" :interval="300" :links="wanjiearray" :playing="playall" :loop="true" />
|
||||
</view>
|
||||
<view class="caigou tp">
|
||||
<donghua width="18vw" height="18vw" :interval="300" :links="caigouarray" :playing="playall" :loop="true" />
|
||||
</view>
|
||||
<view class="ruku tp">
|
||||
<donghua width="11vw" height="11vw" :interval="300" :links="rukuarray" :playing="playall" :loop="true" />
|
||||
</view>
|
||||
<view class="chuku tp">
|
||||
<donghua width="11vw" height="11vw" :interval="300" :links="rukuarray" :playing="playall" :loop="true" />
|
||||
</view>
|
||||
<view class="jianhuo tp">
|
||||
<donghua width="40vw" height="40vw" :interval="300" :links="jianhuoarray" :playing="playall" :loop="true" />
|
||||
</view>
|
||||
<view class="pandan tp">
|
||||
<image src="/static/index/warehouse/newhome/count.png" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="return tp">
|
||||
<image src="/static/index/warehouse/newhome/return.png" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="lead tp">
|
||||
<image src="/static/index/warehouse/newhome/lead.png" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="picking tp">
|
||||
<image src="/static/index/warehouse/newhome/picking.png" mode="widthFix"></image>
|
||||
</view>
|
||||
<view :style="moverStyle" >
|
||||
<image style="width: 100%;height: 100%;" src="/static/index/warehouse/newhome/train9.png" mode="widthFix"></image>
|
||||
</view>
|
||||
<!-- <view class="contitem tp">
|
||||
<image src="/static/index/warehouse/home/warehouse.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="hldy tp">
|
||||
<donghua width="16vw" height="8.6vw" :links="logoval.url" :playing="true" />
|
||||
</view>
|
||||
<view class="route tp">
|
||||
<image src="/static/index/warehouse/home/carrhate.gif" mode="aspectFill" style="z-index: 4;"></image>
|
||||
</view>
|
||||
<view class="pulu1 tp">
|
||||
<image src="/static/index/warehouse/home/pu3.gif" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="pulu2 tp">
|
||||
<image src="/static/index/warehouse/home/pu2.gif" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="clikurlbox">
|
||||
<view class="tp" :class="'itemact'+(index+1)" v-for="(item,index) in animArray" :key='index'
|
||||
@click="housactive(index)">
|
||||
<donghua :width="item.width" :height="item.height" :links="item.url" :playing="index == housedex" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="cardtm">
|
||||
<view class="b" :class="{ 'actve':housedex == i}" v-for="(v,i) in ['采购','盘点','拣货','后勤','退货','监控室']"
|
||||
@click="housactive(i)">
|
||||
<text></text>{{v}}
|
||||
<view class="tp">
|
||||
<image src="/static/index/warehouse/home/z.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="contain-right-button" @click="goback()">
|
||||
<image class="buttont-img" style="margin-top: 4rpx;" src="/static/index/purchaseorder/back.png" />
|
||||
<view class="button-font">
|
||||
返回
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick } from 'vue';
|
||||
|
||||
const paiziarray =
|
||||
genPaths(
|
||||
'/static/index/warehouse/newhome/',
|
||||
'logo',
|
||||
3, // 张数
|
||||
'png',
|
||||
1, // 起始索引为 1
|
||||
false // 不补零
|
||||
)
|
||||
const jiankongarray =
|
||||
genPaths(
|
||||
'/static/index/warehouse/newhome/',
|
||||
'monitor',
|
||||
4, // 张数
|
||||
'png',
|
||||
0, // 起始索引为 1
|
||||
false // 不补零
|
||||
)
|
||||
const wanjiearray =
|
||||
genPaths(
|
||||
'/static/index/warehouse/newhome/',
|
||||
'end',
|
||||
6, // 张数
|
||||
'png',
|
||||
0, // 起始索引为 1
|
||||
false // 不补零
|
||||
)
|
||||
const caigouarray = genPaths(
|
||||
'/static/index/warehouse/newhome/',
|
||||
'purchase',
|
||||
4, // 张数
|
||||
'png',
|
||||
0, // 起始索引为 1
|
||||
false // 不补零
|
||||
)
|
||||
const rukuarray = genPaths(
|
||||
'/static/index/warehouse/newhome/',
|
||||
'unit1-',
|
||||
5, // 张数
|
||||
'png',
|
||||
0, // 起始索引为 1
|
||||
false // 不补零
|
||||
)
|
||||
const jianhuoarray = genPaths(
|
||||
'/static/index/warehouse/newhome/',
|
||||
'Warehouse',
|
||||
4, // 张数
|
||||
'png',
|
||||
1, // 起始索引为 1
|
||||
false // 不补零
|
||||
)
|
||||
const playall = ref(false);
|
||||
onMounted(() => {
|
||||
playall.value = true
|
||||
})
|
||||
|
||||
const housedex = ref(0);
|
||||
const lastTap = ref(0)
|
||||
const DOUBLE_TAP_DELAY = 300;
|
||||
const setout = ref(null)
|
||||
const navurl = ref('')
|
||||
const housactive = (index : number) => {
|
||||
console.log(index)
|
||||
housedex.value = index;
|
||||
const now = Date.now()
|
||||
if (now - lastTap.value < DOUBLE_TAP_DELAY) {
|
||||
// 双击成立
|
||||
clearTimeout(setout.value)
|
||||
if (index == 1) {
|
||||
navurl.value = 'pages/Warehouse/paymoney'
|
||||
uni.navigateTo({
|
||||
url: '/' + navurl.value
|
||||
})
|
||||
}
|
||||
if (index == 0) {
|
||||
navurl.value = 'pages/procurement/material'
|
||||
uni.navigateTo({
|
||||
url: '/' + navurl.value
|
||||
})
|
||||
}
|
||||
if (index == 2) {
|
||||
navurl.value = 'pages/Warehouse/picking'
|
||||
uni.navigateTo({
|
||||
url: '/' + navurl.value
|
||||
})
|
||||
}
|
||||
|
||||
if (index === 3) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/watch/full"
|
||||
})
|
||||
}
|
||||
if (index === 5) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/watch/full"
|
||||
})
|
||||
}
|
||||
if (index == 7) {
|
||||
navurl.value = 'pages/procurement/outbound?code=0'
|
||||
uni.navigateTo({
|
||||
url: '/' + navurl.value
|
||||
})
|
||||
}
|
||||
if (index == 8) {
|
||||
navurl.value = 'pages/procurement/outbound?code=1'
|
||||
uni.navigateTo({
|
||||
url: '/' + navurl.value
|
||||
})
|
||||
}
|
||||
// 重置，避免多次触发
|
||||
lastTap.value = 0
|
||||
} else {
|
||||
setout.value = setTimeout(() => {
|
||||
// console.log("点击哪个了", index)
|
||||
}, DOUBLE_TAP_DELAY)
|
||||
// 记录本次时间，等待下次点击
|
||||
lastTap.value = now
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
function genPaths(base, prefix, count, ext = 'png', startIndex = 0, pad = false) {
|
||||
return Array.from({ length: count }, (_, i) => {
|
||||
const idx = pad
|
||||
? String(i + startIndex).padStart(2, '0')
|
||||
: i + startIndex
|
||||
return `${base}/${prefix}${idx}.${ext}`
|
||||
})
|
||||
}
|
||||
const animArray = ref([
|
||||
{
|
||||
url: genPaths(
|
||||
'/static/index/warehouse/home/',
|
||||
'Procurement',
|
||||
5, // 张数
|
||||
'png',
|
||||
0, // 起始索引为 1
|
||||
false // 不补零
|
||||
),
|
||||
width: '22.3vw',
|
||||
height: '13.6vw'
|
||||
},
|
||||
{
|
||||
url: genPaths(
|
||||
'/static/index/warehouse/home',
|
||||
'inventory',
|
||||
4, // 张数
|
||||
'png',
|
||||
0, // 起始索引为 1
|
||||
false // 不补零
|
||||
),
|
||||
width: '11vw',
|
||||
height: '10vw'
|
||||
},
|
||||
{
|
||||
url: genPaths(
|
||||
'/static/index/warehouse/home',
|
||||
'pick',
|
||||
4, // 张数
|
||||
'png',
|
||||
0, // 起始索引为 1
|
||||
false // 不补零
|
||||
),
|
||||
width: '11vw',
|
||||
height: '9vw'
|
||||
},
|
||||
{
|
||||
url: genPaths(
|
||||
'/static/index/warehouse/home',
|
||||
'unit1-',
|
||||
5, // 张数
|
||||
'png',
|
||||
0, // 起始索引为 1
|
||||
false // 不补零
|
||||
),
|
||||
width: '14.3vw',
|
||||
height: '13vw'
|
||||
},
|
||||
{
|
||||
url: genPaths(
|
||||
'/static/index/warehouse/home',
|
||||
'unit1-',
|
||||
5, // 张数
|
||||
'png',
|
||||
0, // 起始索引为 1
|
||||
false // 不补零
|
||||
),
|
||||
width: '14.3vw',
|
||||
height: '13vw'
|
||||
},
|
||||
{
|
||||
url: genPaths(
|
||||
'/static/index/warehouse/home',
|
||||
'unit11-',
|
||||
5, // 张数
|
||||
'png',
|
||||
0, // 起始索引为 1
|
||||
false // 不补零
|
||||
),
|
||||
width: '14.3vw',
|
||||
height: '13vw'
|
||||
},
|
||||
])
|
||||
const logoval = reactive({
|
||||
url: genPaths(
|
||||
'/static/index/warehouse/home',
|
||||
'logo',
|
||||
3, // 张数
|
||||
'png',
|
||||
1, // 起始索引为 1
|
||||
false // 不补零
|
||||
)
|
||||
|
||||
})
|
||||
const goback = () => {
|
||||
console.log("?/////")
|
||||
uni.navigateBack()
|
||||
}
|
||||
// 当前坐标（px）
|
||||
const x = ref(50)
|
||||
const y = ref(54)
|
||||
// const x = ref(25)
|
||||
// const y = ref(44)
|
||||
// 默认过渡时长（s）
|
||||
const duration = ref(0.7)
|
||||
const easing = 'cubic-bezier(.22,.9,.32,1)' // 柔和的 easing
|
||||
|
||||
// 样式绑定：translate3d + transition（GPU 加速）
|
||||
const moverStyle = computed(() => {
|
||||
return {
|
||||
position: 'fixed',
|
||||
left: '0',
|
||||
top: '0',
|
||||
width: '7vw', // 图片宽高按需改
|
||||
height: '7vw',
|
||||
transform: `translate3d(${x.value}vw, ${y.value}vw, 0)`,
|
||||
transition: `transform ${duration.value}s ${easing}`,
|
||||
willChange: 'transform'
|
||||
}
|
||||
})
|
||||
|
||||
// 调用函数：moveTo(pxX, pxY, seconds)
|
||||
function moveTo(pxX, pxY, seconds = 0.6) {
|
||||
// 设置时长（秒），然后直接改坐标
|
||||
duration.value = seconds
|
||||
x.value = pxX
|
||||
y.value = pxY
|
||||
}
|
||||
const ceshi = () => {
|
||||
moveTo(25,45,6)
|
||||
}
|
||||
const back = () => {
|
||||
moveTo(50,54,1)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
// .clikurlbox {
|
||||
// position: fixed;
|
||||
// width: 100vw;
|
||||
// height: 100vw;
|
||||
// top: 0;
|
||||
// left: 0;
|
||||
// overflow: hidden;
|
||||
// z-index: 61;
|
||||
|
||||
// .itemact1 {
|
||||
// width: 22.3vw;
|
||||
// height: 13.6vw;
|
||||
// bottom: 9.8vw;
|
||||
// left: 12.6vw;
|
||||
// z-index: 31;
|
||||
// }
|
||||
|
||||
// .itemact2 {
|
||||
// width: 9vw;
|
||||
// height: 9vw;
|
||||
// top: 22.5vw;
|
||||
// left: 16.5vw;
|
||||
// z-index: 57;
|
||||
// }
|
||||
|
||||
// .itemact3 {
|
||||
// width: 11vw;
|
||||
// height: 9vw;
|
||||
// top: 37vw;
|
||||
// left: 48vw;
|
||||
// z-index: 55;
|
||||
// }
|
||||
|
||||
// .itemact4 {
|
||||
// width: 14.4vw;
|
||||
// height: 13vw;
|
||||
// top: 35vw;
|
||||
// right: 4.4vw;
|
||||
// z-index: 65;
|
||||
// }
|
||||
|
||||
// .itemact5 {
|
||||
// width: 14.4vw;
|
||||
// height: 10vw;
|
||||
// bottom: 3vw;
|
||||
// right: 21vw;
|
||||
// z-index: 65;
|
||||
// }
|
||||
|
||||
// .itemact6 {
|
||||
// width: 18.2vw;
|
||||
// height: 12vw;
|
||||
// top: 8vw;
|
||||
// left: 12vw;
|
||||
// z-index: 65;
|
||||
// }
|
||||
|
||||
// view {
|
||||
// position: fixed;
|
||||
// z-index: 10;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .cardtm {
|
||||
// position: relative;
|
||||
// z-index: 66;
|
||||
|
||||
// >view {
|
||||
// position: fixed;
|
||||
// min-width: 5vw;
|
||||
// height: 2.7vw;
|
||||
// border-radius: 1.35vw;
|
||||
// box-shadow: 0rpx 0rpx 0.3vw 0rpx rgba(174, 174, 188, 0.4);
|
||||
// z-index: 66;
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
// padding: 0 1vw;
|
||||
// white-space: nowrap;
|
||||
// z-index: 70;
|
||||
|
||||
// &:nth-child(1) {
|
||||
// bottom: 33.5vh;
|
||||
// left: 20.5vw;
|
||||
// }
|
||||
|
||||
// &:nth-child(2) {
|
||||
// top: 28vw;
|
||||
// left: 26.5vw;
|
||||
// }
|
||||
|
||||
// &:nth-child(3) {
|
||||
// bottom: 21vw;
|
||||
// left: 55vw;
|
||||
// }
|
||||
|
||||
// &:nth-child(4) {
|
||||
// top: 35vw;
|
||||
// right: 6.5vw;
|
||||
// }
|
||||
|
||||
// &:nth-child(5) {
|
||||
// bottom: 11.5vw;
|
||||
// right: 23.5vw;
|
||||
// }
|
||||
|
||||
// &:nth-child(6) {
|
||||
// top: 6vw;
|
||||
// left: 17vw;
|
||||
// }
|
||||
|
||||
// text {
|
||||
// width: 1vw;
|
||||
// height: 1vw;
|
||||
// border-radius: 50%;
|
||||
// border: 1px solid rgba(0, 137, 254, 1);
|
||||
// margin: 0 0.4vw 0 0;
|
||||
// }
|
||||
|
||||
// view {
|
||||
// width: 2.8vw;
|
||||
// height: 4.4vw;
|
||||
// position: absolute;
|
||||
// top: 2vw;
|
||||
// left: 30%;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .actve {
|
||||
// background: linear-gradient(-45deg, #0089FE, #97C1FF) !important;
|
||||
// color: #fff !important;
|
||||
|
||||
// text {
|
||||
// border: 1px solid #fff;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .b {
|
||||
// background: #EFF2F6;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .pulu1 {
|
||||
// width: 28.2vw;
|
||||
// height: 9.8vw;
|
||||
// position: fixed;
|
||||
// top: 30vw;
|
||||
// right: 9.2vw;
|
||||
// z-index: 60;
|
||||
// overflow: auto;
|
||||
|
||||
// image {
|
||||
// position: absolute;
|
||||
// top: 0;
|
||||
// left: 0;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .pulu2 {
|
||||
// width: 16.8vw;
|
||||
// height: 24vw;
|
||||
// position: fixed;
|
||||
// top: 30.7vw;
|
||||
// right: 21.1vw;
|
||||
// z-index: 60;
|
||||
|
||||
// image {
|
||||
// position: absolute;
|
||||
// top: 0;
|
||||
// left: 0;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .route {
|
||||
// width: 99.5vw;
|
||||
// height: 51.2vw;
|
||||
// position: fixed;
|
||||
// top: 4.5vw;
|
||||
// left: 0.3vw;
|
||||
// z-index: 2;
|
||||
|
||||
// image {
|
||||
// position: absolute;
|
||||
// top: 0;
|
||||
// left: 0;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .contitem {
|
||||
// width: 48vw;
|
||||
// height: 36vw;
|
||||
// position: fixed;
|
||||
// top: 5.3vw;
|
||||
// left: 28.2vw;
|
||||
// z-index: 50;
|
||||
// }
|
||||
|
||||
// .hldy {
|
||||
// position: fixed;
|
||||
// left: 6.7vw;
|
||||
// bottom: 3.7vw;
|
||||
|
||||
// }
|
||||
|
||||
|
||||
|
||||
// .tp {
|
||||
// image {
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .contain-right-button {
|
||||
// position: fixed;
|
||||
// top: 5vh;
|
||||
// right: 2vw;
|
||||
// width: 7.3vw;
|
||||
// height: 3.3vw;
|
||||
// background: #FFFFFF;
|
||||
// border-radius: 1.65vw;
|
||||
// border: 1px solid #D9DADC;
|
||||
// font-weight: 400;
|
||||
// font-size: 1.4vw;
|
||||
// color: #222;
|
||||
// display: flex;
|
||||
// justify-content: center;
|
||||
// align-items: center;
|
||||
// margin: 0 0 0 0.7vw;
|
||||
// color: #555555;
|
||||
// z-index: 99;
|
||||
|
||||
// image {
|
||||
// width: 1.5vw;
|
||||
// height: 1.3vw;
|
||||
// margin: 0 0.5vw 0 0;
|
||||
// }
|
||||
|
||||
// }
|
||||
.home {
|
||||
// margin-top: 40rpx;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
position: fixed;
|
||||
z-index: 0;
|
||||
// background-color: red;
|
||||
|
||||
.all-home {
|
||||
width: 100%;
|
||||
height: 100% ;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.tp {
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.paizi {
|
||||
width: 18vw;
|
||||
height: 18vw;
|
||||
position: fixed;
|
||||
bottom: 0.3vw;
|
||||
left: 10vw;
|
||||
// z-index: 50;
|
||||
}
|
||||
|
||||
.jiankong {
|
||||
width: 17vw;
|
||||
height: 17vw;
|
||||
position: fixed;
|
||||
top: 1.5vw;
|
||||
left: 12vw;
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
.wanjie {
|
||||
width: 18vw;
|
||||
height: 18vw;
|
||||
position: fixed;
|
||||
top: 19vw;
|
||||
left: 12vw;
|
||||
z-index: 50;
|
||||
}
|
||||
.pandan{
|
||||
width: 9.3vw;
|
||||
height: 9.3vw;
|
||||
position: fixed;
|
||||
top: 23vw;
|
||||
left: 29vw;
|
||||
z-index: 50;
|
||||
}
|
||||
.caigou{
|
||||
width: 18vw;
|
||||
height: 18vw;
|
||||
position: fixed;
|
||||
top: 34vw;
|
||||
left: 37vw;
|
||||
z-index: 50;
|
||||
}
|
||||
.ruku{
|
||||
width: 11vw;
|
||||
height: 11vw;
|
||||
position: fixed;
|
||||
bottom: 9vw;
|
||||
right: 17vw;
|
||||
z-index: 50;
|
||||
}
|
||||
.chuku{
|
||||
width: 11vw;
|
||||
height: 11vw;
|
||||
position: fixed;
|
||||
bottom: 20.5vw;
|
||||
right: 2.5vw;
|
||||
z-index: 50;
|
||||
}
|
||||
.return{
|
||||
width: 7vw;
|
||||
height: 7vw;
|
||||
position: fixed;
|
||||
bottom: 8.8vw;
|
||||
right: 25vw;
|
||||
z-index: 50;
|
||||
}
|
||||
.lead{
|
||||
width: 7vw;
|
||||
height: 7vw;
|
||||
position: fixed;
|
||||
bottom: 20vw;
|
||||
right: 10vw;
|
||||
z-index: 50;
|
||||
}
|
||||
.jianhuo{
|
||||
width: 40vw;
|
||||
height: 40vw;
|
||||
position: fixed;
|
||||
top: 0vw;
|
||||
right:23vw;
|
||||
z-index: 50;
|
||||
}
|
||||
.picking{
|
||||
width: 12vw;
|
||||
height: 12vw;
|
||||
position: fixed;
|
||||
top: 24vw;
|
||||
right:27vw;
|
||||
z-index: 50;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue