导航页样式，入库页样式，分页
This commit is contained in:
@@ -20,14 +20,18 @@ uni-button{
|
|||||||
.content{
|
.content{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
background-color: #f8f8f8;
|
background: center / 100% 100% url(./static/images/page_bg.jpg) no-repeat;
|
||||||
|
background-color: #00152d;
|
||||||
}
|
}
|
||||||
.search-confirm-wrap {
|
.search-confirm-wrap {
|
||||||
width: calc(100% - 30px);
|
width: calc(100% - 60rpx);
|
||||||
background-color: #fff;
|
/* background-color: #fff; */
|
||||||
margin: 15px auto;
|
margin: 30rpx auto;
|
||||||
border-radius: 12px;
|
border-radius: 12rpx;
|
||||||
padding: 15px;
|
padding: 30rpx;
|
||||||
|
background-color: linear-gradient(to right, rgba(8, 38, 68, 0.5) 1%, rgba(8, 38, 68, 0.98) 100%);
|
||||||
|
border: 1rpx solid #0490DD;
|
||||||
|
box-shadow: rgba(4, 136, 203, 0.2) -6rpx 6px 12rpx 2rpx, rgba(4, 136, 203, 0.2) 6rpx -6rpx 12rpx 2rpx;
|
||||||
}
|
}
|
||||||
.search-label{
|
.search-label{
|
||||||
height: 35px;
|
height: 35px;
|
||||||
@@ -76,40 +80,39 @@ uni-button{
|
|||||||
background-color: #e1e1e1;
|
background-color: #e1e1e1;
|
||||||
}
|
}
|
||||||
.confirm-button{
|
.confirm-button{
|
||||||
min-width: 80px;
|
min-width: 160rpx;
|
||||||
height: 36px;
|
height: 72rpx;
|
||||||
background-color: #ff6a00;
|
|
||||||
color: #fff;
|
color: #fff;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
font-size: 14px;
|
font-size: 28rpx;
|
||||||
margin-left: 6px;
|
margin-left: 20rpx;
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
border-radius: 12px;
|
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
|
background: center / 100% 100% url(./static/images/button.png) no-repeat;
|
||||||
}
|
}
|
||||||
.confirm-button_disabled {
|
.confirm-button_disabled {
|
||||||
background-color: #fff;
|
background: center / 100% 100% url(./static/images/button_disabled.png) no-repeat;
|
||||||
color: #889dc7;
|
|
||||||
border: 1px solid #dde9f7;
|
|
||||||
}
|
|
||||||
.title-line {
|
|
||||||
width: calc(100% - 30px);
|
|
||||||
height: 1px;
|
|
||||||
background-color: #dde9f7;
|
|
||||||
margin: 10px auto 20px auto;
|
|
||||||
}
|
}
|
||||||
.table-title_wraper {
|
.table-title_wraper {
|
||||||
width: calc(100% - 30px);
|
width: calc(100% - 60rpx);
|
||||||
margin: 0px auto;
|
margin: 0 auto;
|
||||||
font-size: 16px;
|
font-size: 32rpx;
|
||||||
color: #000;
|
color: #fff;
|
||||||
line-height: 35px;
|
line-height: 70rpx;
|
||||||
|
padding: 30rpx 0 0 30rpx;
|
||||||
|
background: center / 100% 100% url(./static/images/bg-task-r1.png) no-repeat;
|
||||||
}
|
}
|
||||||
.grid-wrap{
|
.grid-wrap{
|
||||||
|
width: calc(100% - 60rpx);
|
||||||
|
height: calc(100% - 450rpx); /** 90 + 140 +100+60 */
|
||||||
|
padding: 30rpx 60rpx;
|
||||||
|
margin: 10rpx auto 0;
|
||||||
|
background: center / 100% 100% url(./static/images/bg-task-r2.png) no-repeat;
|
||||||
|
/* overflow-y: scroll; */
|
||||||
|
}
|
||||||
|
.table-wrap {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: calc(100% - 206px); /** 42+ 98+35+31 */
|
height: calc(100% - 134rpx)
|
||||||
padding: 0 15px 30px 15px;
|
|
||||||
overflow-y: scroll;
|
|
||||||
}
|
}
|
||||||
.grid-wrap .grid-table{
|
.grid-wrap .grid-table{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@@ -177,17 +180,19 @@ uni-button{
|
|||||||
top: 0;
|
top: 0;
|
||||||
z-index: 49;
|
z-index: 49;
|
||||||
}
|
}
|
||||||
|
.zd-th-wraper{
|
||||||
|
background: center / 100% 100% url(./static/images/grid_bg.png) no-repeat;
|
||||||
|
}
|
||||||
.zd-th {
|
.zd-th {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
font-size: 15px;
|
font-size: 30rpx;
|
||||||
line-height: 18px;
|
line-height: 36rpx;
|
||||||
height: 40px;
|
height: 80rpx;
|
||||||
color: #7d7d7d;
|
color: #AFBED8;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding: 12px 5px;
|
padding: 24rpx 10rpx;
|
||||||
background-color: #dcdfea;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
.zd-sec-th {
|
.zd-sec-th {
|
||||||
@@ -200,39 +205,32 @@ uni-button{
|
|||||||
color: #7d7d7d;
|
color: #7d7d7d;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding: 12px 5px;
|
padding: 24rpx 10rpx;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
.zd-td {
|
.zd-td {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
font-size: 14px;
|
font-size: 28rpx;
|
||||||
line-height: 18px;
|
line-height: 36rpx;
|
||||||
height: 46px;
|
height: 92rpx;
|
||||||
color: #7d7d7d;
|
color: #fff;
|
||||||
padding: 0 8px;
|
padding: 0 16rpx;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-bottom: 1px solid #ebeef5;
|
border-bottom: 2rpx solid #7A9FE0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
.zd-th_fir {
|
|
||||||
border-top-left-radius: 12px;
|
|
||||||
border-bottom-left-radius: 12px;
|
|
||||||
}
|
|
||||||
.zd-th_last {
|
|
||||||
border-top-right-radius: 12px;
|
|
||||||
border-bottom-right-radius: 12px;
|
|
||||||
}
|
|
||||||
.zd-checkbox {
|
.zd-checkbox {
|
||||||
width: 22px;
|
width: 44rpx;
|
||||||
height: 22px;
|
height: 44rpx;
|
||||||
border: 1px solid #008deb;
|
background: center / 100% 100% url(./static/images/icon-check1.png) no-repeat;
|
||||||
background-color: #fff;
|
}
|
||||||
border-radius: 4px;
|
.zd-checkbox_active {
|
||||||
|
background: center / 100% 100% url(./static/images/icon-check2.png) no-repeat;
|
||||||
}
|
}
|
||||||
.fontcol1 {
|
.fontcol1 {
|
||||||
color: #007de7;
|
color: #3CC1FF;
|
||||||
}
|
}
|
||||||
.fontcol2 {
|
.fontcol2 {
|
||||||
color: #000;
|
color: #000;
|
||||||
|
|||||||
@@ -52,21 +52,26 @@
|
|||||||
@import '@/common/style/mixin.styl';
|
@import '@/common/style/mixin.styl';
|
||||||
.header
|
.header
|
||||||
_fj()
|
_fj()
|
||||||
_wh(100%, 42px)
|
_wh(100%, 90rpx)
|
||||||
background-color #fff
|
background-color #041427
|
||||||
|
border-bottom 1rpx solid #13568B
|
||||||
z-index 200
|
z-index 200
|
||||||
padding 0 15px
|
padding 0 30rpx
|
||||||
box-shadow: 0 2px 4px 0 rgba(0,0,0,.05);
|
box-shadow: 0 2rpx 4rpx 0 RGBA(19, 86, 139, 0.5);
|
||||||
.page_name
|
.page_name
|
||||||
_font(16px, 20px, #000,700,center)
|
_font(50rpx, 90rpx, #F6F9FE,700,center)
|
||||||
|
font-family: YouSheBiaoTiHei
|
||||||
|
background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(49,190,255,0.9) 0%, rgba(239,252,254,1) 40%);
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
.icon_back {
|
.icon_back {
|
||||||
font-size: 30px;
|
font-size: 60rpx;
|
||||||
line-height: 30px;
|
line-height: 60rpx;
|
||||||
color: #666;
|
color: #fff;
|
||||||
}
|
}
|
||||||
.icon_home {
|
.icon_home {
|
||||||
font-size: 30px;
|
font-size: 60rpx;
|
||||||
line-height: 30px;
|
line-height: 60rpx;
|
||||||
color: #666;
|
color: #fff;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
89
components/Pagination.vue
Normal file
89
components/Pagination.vue
Normal file
@@ -0,0 +1,89 @@
|
|||||||
|
<template>
|
||||||
|
<view class="pagination">
|
||||||
|
<text :disabled="page <= 1" @click="gotoPage(page - 1)"><</text>
|
||||||
|
<text v-for="item in pages" :key="getItemKey(item)" :class="{ active: item === page, ellipsis: item === '...' }" @click="gotoPage(item)">{{ item }}</text>
|
||||||
|
<text :disabled="page >= totalPages" @click="gotoPage(page + 1)">></text>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'Pagination',
|
||||||
|
props: {
|
||||||
|
total: { // 总条目数
|
||||||
|
type: Number,
|
||||||
|
required: true
|
||||||
|
},
|
||||||
|
pageSize: { // 每页显示的条目数
|
||||||
|
type: Number,
|
||||||
|
default: 10
|
||||||
|
},
|
||||||
|
currentPage: { // 当前页码
|
||||||
|
type: Number,
|
||||||
|
default: 1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
totalPages() { // 总页数
|
||||||
|
return Math.ceil(this.total / this.pageSize)
|
||||||
|
},
|
||||||
|
page() { // 当前页码，限定在 1 和总页数之间
|
||||||
|
return Math.max(1, Math.min(this.currentPage, this.totalPages))
|
||||||
|
},
|
||||||
|
pages() { // 可点击的页码数组，最多显示 5 个页码
|
||||||
|
const arr = []
|
||||||
|
let start = Math.max(this.page - 2, 1)
|
||||||
|
let end = Math.min(start + 4, this.totalPages)
|
||||||
|
if (end - start < 4) {
|
||||||
|
end = Math.min(start + 4, this.totalPages)
|
||||||
|
start = Math.max(end - 4, 1)
|
||||||
|
}
|
||||||
|
for (let i = start; i <= end; i++) {
|
||||||
|
arr.push(i)
|
||||||
|
}
|
||||||
|
if (end < this.totalPages) {
|
||||||
|
arr.push('...', this.totalPages)
|
||||||
|
}
|
||||||
|
return arr
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getItemKey(item) { // 获取项的 key
|
||||||
|
return typeof item === 'number' ? item.toString() : item
|
||||||
|
},
|
||||||
|
gotoPage(page) { // 跳转到指定页码
|
||||||
|
if (page > 0 && page <= this.totalPages) {
|
||||||
|
this.$emit('page-change', page)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="stylus" scoped>
|
||||||
|
@import '@/common/style/mixin.styl';
|
||||||
|
.pagination {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;;
|
||||||
|
margin-top: 40rpx;
|
||||||
|
}
|
||||||
|
text {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0 20rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
border: 2rpx solid #ddd;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
_font(30rpx, 70rpx, #053978,,)
|
||||||
|
}
|
||||||
|
|
||||||
|
text.active {
|
||||||
|
background-color: #053978;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
text.ellipsis {
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -125,30 +125,30 @@
|
|||||||
<style lang="stylus">
|
<style lang="stylus">
|
||||||
@import '../common/style/mixin.styl';
|
@import '../common/style/mixin.styl';
|
||||||
.search_wraper
|
.search_wraper
|
||||||
_wh(100%, 38px)
|
_wh(100%, 76rpx)
|
||||||
padding 0 2px 0 12px
|
padding 0 4rpx 0 24rpx
|
||||||
border 1px solid #e1e1e1
|
border 1rpx solid #e1e1e1
|
||||||
background-color #fff
|
background-color #fff
|
||||||
border-radius 12px
|
border-radius 12rpx
|
||||||
.search_input
|
.search_input
|
||||||
width 100%
|
width 100%
|
||||||
height: 38px;
|
height: 76rpx;
|
||||||
line-height: 38px;
|
line-height: 76rpx;
|
||||||
font-size: 14px;
|
font-size: 28rpx;
|
||||||
color: #6a6a6a
|
color: #6a6a6a
|
||||||
.icon-del
|
.icon-del
|
||||||
_wh(35px, 35px)
|
_wh(70rpx, 70rpx)
|
||||||
margin-right 5px
|
margin-right 10rpx
|
||||||
_font(20px,35px,#a2b6cc,,center)
|
_font(40rpx,70rpx,#a2b6cc,,center)
|
||||||
.icon_scan
|
.icon_scan
|
||||||
_wh(70px, 30px)
|
_wh(140rpx, 60rpx)
|
||||||
_font(20px,30px,#fff,,center)
|
_font(40rpx,60rpx,#fff,,center)
|
||||||
background-color $red
|
background-color #3CC1FF
|
||||||
border-radius 12px
|
border-radius 24rpx
|
||||||
.icon_search
|
.icon_search
|
||||||
_wh(35px, 35px)
|
_wh(70rpx, 70rpx)
|
||||||
_font(20px,35px,#a2b6cc,,center)
|
_font(40rpx,70rpx,#a2b6cc,,center)
|
||||||
.input_focus
|
.input_focus
|
||||||
border: 1px solid #889dc7;
|
border: 1rpx solid #889dc7;
|
||||||
box-shadow: 0 0 0 2px rgba(136, 157, 199,.2);
|
box-shadow: 0 0 0 2rpx rgba(136, 157, 199,.2);
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,85 +1,59 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="home_content">
|
<view class="home_content">
|
||||||
<view class="zd-row header">
|
<view class="zd-row header">
|
||||||
<view class="zd-col-8 home_title"></view>
|
|
||||||
<view class="zd-col-8 home_title">首页</view>
|
|
||||||
<view class="zd-col-8 home_title">首页</view>
|
<view class="zd-col-8 home_title">首页</view>
|
||||||
|
<view class="zd-col-8 zd-row jcflexend home_userinfo">
|
||||||
|
<view class="user_icon"></view>
|
||||||
|
<view class="user_name">{{userName}}</view>
|
||||||
|
<view class="exit_text" @tap="Quit">退出</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="userInfo-wrap">
|
<view class="welcome_text_wraper">
|
||||||
<view class="userInfo">
|
<view class="welcome_text">{{userName}}, 欢迎进入诺力三期平板系统！</view>
|
||||||
<text class="p1">{{userName}}</text>
|
|
||||||
<text class="p2">欢迎进入诺力三期平板系统！</text>
|
|
||||||
</view>
|
|
||||||
<view class="exit" @tap="Quit">
|
|
||||||
<view class="icon-exit"></view>
|
|
||||||
<view class="exit-text">退出</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
<view class="zd_wrapper">
|
<view class="zd_wrapper">
|
||||||
<view class="menu-wrap">
|
<view class="zd-row menu-wrap">
|
||||||
<view class="menu-item" v-for="(e, i) in menuList" :key="i" @tap="toPage1(e)">
|
<view class="menu-item" v-for="(e, i) in menuList" :key="i" @tap="toPage(e)">
|
||||||
<image class="menu-img" :src="require('../../static/images/' + e.path + '.png')" alt="">
|
<view class="menu_name_bg" :class="'bg_texture_' + i">
|
||||||
<view class="menu-name">{{e.name}}</view>
|
<view class="menu-name">{{e.name}}</view>
|
||||||
</view>
|
<view class="bill_count">{{e.counts}}</view>
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view v-if="show === true" class="sec_menu_wraper">
|
|
||||||
<view class="sec_menu_w">
|
|
||||||
<view class="menu-item" v-for="(e, i) in secM" :key="i" @click="toPage2(e)">
|
|
||||||
<view class="sec_menu-col_inner">
|
|
||||||
<view class="menu-name menu-name_inner">{{e.name}}</view>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="cancel">
|
|
||||||
<view class="iconfont cancel_icon" @tap="show = false"></view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
|
<view class="left_bg"></view>
|
||||||
|
<view class="left_bg right_bg"></view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import {authority, getBillsCount} from '@/utils/getData2.js'
|
import {getBillsCount} from '@/utils/getData2.js'
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
userName: this.$store.getters.userInfo !== '' ? JSON.parse(this.$store.getters.userInfo).username : '',
|
userName: this.$store.getters.userInfo !== '' ? JSON.parse(this.$store.getters.userInfo).username : '',
|
||||||
menuList: [],
|
menuList: []
|
||||||
show: false,
|
|
||||||
secM: []
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created () {
|
created () {
|
||||||
this._authority()
|
|
||||||
this._getBillsCount()
|
this._getBillsCount()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
async _authority () {
|
|
||||||
let res = await authority()
|
|
||||||
this.menuList = [...res.sonTree]
|
|
||||||
|
|
||||||
},
|
|
||||||
async _getBillsCount () {
|
async _getBillsCount () {
|
||||||
let res = await getBillsCount()
|
let res = await getBillsCount()
|
||||||
console.log(res)
|
this.menuList = [...res]
|
||||||
|
|
||||||
},
|
},
|
||||||
toPage1 (e) {
|
toPage (e) {
|
||||||
if (e.sonTree.length > 0) {
|
let url = ''
|
||||||
this.show = true
|
if (e.ywlx === 'OUT') {
|
||||||
this.secM = e.sonTree
|
url = '/pages/management/out-storage?id=' + e.djlx
|
||||||
} else {
|
} else {
|
||||||
let url = e.router
|
url = '/pages/management/in-storage?id=' + e.djlx
|
||||||
uni.redirectTo({
|
|
||||||
url: url
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
},
|
|
||||||
toPage2 (e) {
|
|
||||||
let url = e.path
|
|
||||||
uni.redirectTo({
|
uni.redirectTo({
|
||||||
url: url
|
url: url
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
Quit () {
|
Quit () {
|
||||||
this.$store.dispatch('delUserInfo')
|
this.$store.dispatch('delUserInfo')
|
||||||
@@ -97,105 +71,105 @@
|
|||||||
position relative
|
position relative
|
||||||
_wh(100%, 100%)
|
_wh(100%, 100%)
|
||||||
_bis(,'../../static/images/home_bg.jpg', 100%, 100%,bottom)
|
_bis(,'../../static/images/home_bg.jpg', 100%, 100%,bottom)
|
||||||
.zd_content
|
|
||||||
padding-top 0
|
|
||||||
.header
|
.header
|
||||||
height 120rpx
|
height 120rpx
|
||||||
padding 0 30rpx 50rpx 30rpx
|
padding 0 30rpx
|
||||||
|
align-items flex-start
|
||||||
|
justify-content flex-end
|
||||||
_bis(,'../../static/images/header_bg.png', 100%, 100%,bottom)
|
_bis(,'../../static/images/header_bg.png', 100%, 100%,bottom)
|
||||||
.home_title
|
.home_title
|
||||||
_font(50rpx,60rpx,#fff,,center)
|
_font(50rpx,70rpx,#F6F9FE,,center)
|
||||||
font-family: YouSheBiaoTiHei;
|
font-family: YouSheBiaoTiHei;
|
||||||
.userInfo-wrap
|
.home_userinfo
|
||||||
_fj()
|
height 70rpx
|
||||||
_wh(calc(100% - 30px),80px)
|
.user_icon
|
||||||
padding 0 15px
|
_wh(50rpx, 50rpx)
|
||||||
_bis($red,'../../static/images/info_bg.png',auto,100%,right,bottom)
|
margin-right 10rpx
|
||||||
border-radius 12px
|
_bis(,'../../static/images/user_icon.png', 100%, 100%,center)
|
||||||
margin 0 auto 15px auto
|
.user_name
|
||||||
.userInfo
|
_font(34rpx,34rpx,#fff,,center)
|
||||||
_fj(,flex-start,column)
|
padding-right 10rpx
|
||||||
.p1
|
margin 18rpx 20rpx 18rpx 0
|
||||||
_font(16px,1,#fff)
|
border-right 1rpx solid #AECAF5
|
||||||
padding-bottom 8px
|
.exit_text
|
||||||
.p2
|
height 60rpx
|
||||||
_font(13px,1,#fff)
|
_font(28rpx,60rpx,#fff,,center)
|
||||||
.exit
|
padding 0 20rpx
|
||||||
_fj()
|
margin 5rpx 0
|
||||||
height 22px
|
_bis(,'../../static/images/state-item_bg.png', 100%, 100%,center)
|
||||||
padding 0 7px
|
.welcome_text_wraper
|
||||||
border 1px solid #FF967C
|
height 140rpx
|
||||||
border-radius 10px
|
margin 30rpx 100rpx
|
||||||
.icon-exit
|
.welcome_text
|
||||||
_wh(10px, 10px)
|
_font(26px, 140rpx, #F6F9FE,,)
|
||||||
_bis(,'../../static/images/exit.png',11px)
|
padding-left 40rpx
|
||||||
.exit-text
|
font-family: YouSheBiaoTiHei
|
||||||
_font(12px,22px,#fff,,right)
|
background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(49,190,255,0.9) 0%, rgba(239,252,254,1) 40%);
|
||||||
padding-left 5px
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
.zd_wrapper
|
.zd_wrapper
|
||||||
_wh(calc(100% - 30px),calc(100% - 152px)) /** 42+80+15+15 */
|
_wh(calc(100% - 200rpx),calc(100% - 450rpx)) /** 120rpx + 200rpx + 130rpx */
|
||||||
padding 15px 5%
|
margin 40rpx 100rpx 0rpx 100rpx
|
||||||
background-color #fff
|
_bis(,'../../static/images/bg-task-r2.png', 100%, 100%,center)
|
||||||
border-radius 12px
|
|
||||||
margin 0 auto 15px auto
|
|
||||||
.menu-wrap
|
.menu-wrap
|
||||||
_fj(flex-start,center,,wrap)
|
flex-wrap wrap
|
||||||
|
justify-content flex-start
|
||||||
|
align-content center
|
||||||
height 100%
|
height 100%
|
||||||
.menu-item
|
.menu-item
|
||||||
_fj()
|
width 20%
|
||||||
flex-direction column
|
margin-bottom 100rpx
|
||||||
_wh(30%, auto)
|
.menu_name_bg
|
||||||
margin-bottom 20px
|
position relative
|
||||||
_font(13px, 30px,#e74f1a,,center)
|
_wh(200rpx, 200rpx)
|
||||||
&:nth-child(3n+2)
|
margin 0 auto
|
||||||
margin-left 5%
|
border-radius 40rpx
|
||||||
margin-right 5%
|
background-image: radial-gradient( ellipse farthest-corner at 22rpx 22rpx , #afafb9, #afafb9 50%, #ffffff 50%);
|
||||||
::v-deep .menu-img
|
background-size: 22rpx 22rpx;
|
||||||
_wh(100%, auto)
|
.bg_texture_1, .bg_texture_7
|
||||||
img
|
background: repeating-linear-gradient( -45deg, #afafb9, #afafb9 10rpx, #ffffff 10rpx, #ffffff 16rpx );
|
||||||
position relative
|
.menu-name
|
||||||
opacity 1
|
background-color rgba(49, 95, 255, 0.8)
|
||||||
_wh(55%, auto)
|
.bg_texture_3, .bg_texture_6
|
||||||
max-width 90px
|
background-image: repeating-linear-gradient(45deg, #afafb9 25%, transparent 25%, transparent 75%, #afafb9 75%, #afafb9), repeating-linear-gradient(45deg, #afafb9 25%, #ffffff 25%, #ffffff 75%, #afafb9 75%, #afafb9);
|
||||||
margin 0 auto 0.1px
|
background-position: 0 0, 22rpx 22rpx;
|
||||||
|
background-size: 44rpx 22rpx;
|
||||||
|
.menu-name
|
||||||
|
background-color rgba(0, 239, 48, 0.8)
|
||||||
|
.bg_texture_2, .bg_texture_5
|
||||||
|
background: radial-gradient(circle, transparent 20%, #ffffff 20%, #ffffff 80%, transparent 80%, transparent), radial-gradient(circle, transparent 20%, #ffffff 20%, #ffffff 80%, transparent 80%, transparent) 27.5rpx 27.5rpx, linear-gradient(#afafb9 4rpx, transparent 4rpx) 0 -4rpx, linear-gradient(90deg, #afafb9 4rpx, #ffffff 4rpx) -4rpx 0;
|
||||||
|
background-size: 55rpx 55rpx, 55rpx 55rpx, 27.5rpx 27.5rpx, 27.5rpx 27.5rpx;
|
||||||
|
.menu-name
|
||||||
|
background-color rgba(255, 189, 45, 0.8)
|
||||||
|
.bg_texture_4
|
||||||
|
.menu-name
|
||||||
|
background-color rgba(255, 139, 69, 0.8)
|
||||||
.menu-name
|
.menu-name
|
||||||
_font(14px, 18px, #444,,center)
|
display flex
|
||||||
.sec_menu_wraper
|
justify-content center
|
||||||
position fixed
|
align-items center
|
||||||
top 0
|
_wh(200rpx, 200rpx)
|
||||||
left 0
|
padding 20rpx
|
||||||
_wh(100%, 100%)
|
border-radius 40rpx
|
||||||
background-color rgba(0, 0, 0, .9)
|
_font(40rpx, 50rpx, #fff,bold,center)
|
||||||
z-index 2017
|
background-color rgba(0,166,255,0.8)
|
||||||
flex-direction column
|
.bill_count
|
||||||
.sec_menu_w
|
position absolute
|
||||||
_fj()
|
top -20rpx
|
||||||
_wh(calc(100% - 30px), calc(100% - 50px))
|
right -20rpx
|
||||||
padding 0 12px
|
_wh(60rpx, 60rpx)
|
||||||
margin 0 auto
|
background-color $red
|
||||||
flex-wrap wrap
|
|
||||||
align-content center
|
|
||||||
&::after
|
|
||||||
content ''
|
|
||||||
display block
|
|
||||||
_wh(30%,0)
|
|
||||||
.sec_menu-col
|
|
||||||
background-color transparent
|
|
||||||
border none
|
|
||||||
height auto
|
|
||||||
.sec_menu-col_inner
|
|
||||||
_fj(center)
|
|
||||||
_wh(80px, 80px)
|
|
||||||
border-radius 50%
|
border-radius 50%
|
||||||
background-color $yellow
|
_font(40rpx, 60rpx, #fff,bold,center)
|
||||||
margin 0 auto
|
box-shadow 6rpx 6rpx 2rpx 2rpx rgba(0,0,0,.3)
|
||||||
.menu-name_inner
|
.left_bg
|
||||||
color #fff
|
position absolute
|
||||||
padding 0 10px
|
left 0
|
||||||
.cancel
|
top 0
|
||||||
_wh(100%, 50px)
|
_wh(50rpx, 100%)
|
||||||
padding 0 12px
|
_bis(,'../../static/images/hud_left.png', 100%, ,center)
|
||||||
overflow hidden
|
.right_bg
|
||||||
background-color rgba(255, 255, 255, .3)
|
left auto
|
||||||
box-shadow 0 0.5px 2px 0 rgba(160,160,160,0.9)
|
right 0
|
||||||
|
background-image url('../../static/images/hud_right.png')
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -15,46 +15,47 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="zd-row jcflexstart table-title_wraper">
|
<view class="zd-row jcflexstart table-title_wraper">
|
||||||
<view class="iconfont mgr5"></view>
|
|
||||||
<text>采购入库</text>
|
<text>采购入库</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="title-line"></view>
|
|
||||||
<view class="grid-wrap">
|
<view class="grid-wrap">
|
||||||
<view class="zd-row">
|
<view class="table-wrap">
|
||||||
<view class="zd-col-2 zd-th zd-th_fir"><text>序号</text></view>
|
<view class="zd-row zd-th-wraper">
|
||||||
<view class="zd-col-2 zd-th"><view class="zd-checkbox"></view></view>
|
<view class="zd-col-2 zd-th"><text>序号</text></view>
|
||||||
<view class="zd-col-3 zd-th"><text>入库单号</text></view>
|
<view class="zd-col-2 zd-th"><view class="zd-checkbox"></view></view>
|
||||||
<view class="zd-col-3 zd-th"><text>EAS单号</text></view>
|
<view class="zd-col-3 zd-th"><text>入库单号</text></view>
|
||||||
<view class="zd-col-2 zd-th"><text>状态</text></view>
|
<view class="zd-col-3 zd-th"><text>EAS单号</text></view>
|
||||||
<view class="zd-col-3 zd-th"><text>去向</text></view>
|
<view class="zd-col-2 zd-th"><text>状态</text></view>
|
||||||
<view class="zd-col-3 zd-th"><text>入库日期</text></view>
|
<view class="zd-col-3 zd-th"><text>去向</text></view>
|
||||||
<view class="zd-col-3 zd-th"><text>领料人</text></view>
|
<view class="zd-col-3 zd-th"><text>入库日期</text></view>
|
||||||
<view class="zd-col-3 zd-th zd-th_last"><text>制单人</text></view>
|
<view class="zd-col-3 zd-th"><text>领料人</text></view>
|
||||||
</view>
|
<view class="zd-col-3 zd-th"><text>制单人</text></view>
|
||||||
<view class="allwidth" v-for="(e, i) in dataList" :key="i">
|
|
||||||
<view class="zd-row">
|
|
||||||
<view class="zd-col-2 zd-td"><text>{{i+1}}</text></view>
|
|
||||||
<view class="zd-col-2 zd-td"><view class="zd-checkbox"></view></view>
|
|
||||||
<view class="zd-col-3 zd-td fontcol1"><text>{{e.a}}</text></view>
|
|
||||||
<view class="zd-col-3 zd-td fontcol2"><text>{{e.b}}</text></view>
|
|
||||||
<view class="zd-col-2 zd-td"><text class="fontbg1">{{e.c}}</text></view>
|
|
||||||
<view class="zd-col-3 zd-td fontcol2"><text>{{e.d}}</text></view>
|
|
||||||
<view class="zd-col-3 zd-td"><text>{{e.e}}</text></view>
|
|
||||||
<view class="zd-col-3 zd-td"><text>{{e.f}}</text></view>
|
|
||||||
<view class="zd-col-3 zd-td"><text>{{e.g}}</text></view>
|
|
||||||
</view>
|
</view>
|
||||||
<view class="zd-row zd-sec-table">
|
<view class="allwidth" v-for="(e, i) in dataList" :key="i">
|
||||||
<view class="zd-col-2 zd-sec-th"><text>序号</text></view>
|
<view class="zd-row">
|
||||||
<view class="zd-col-2 zd-sec-th"><view class="zd-checkbox"></view></view>
|
<view class="zd-col-2 zd-td"><text>{{i+1}}</text></view>
|
||||||
<view class="zd-col-3 zd-sec-th"><text>入库单号</text></view>
|
<view class="zd-col-2 zd-td"><view class="zd-checkbox zd-checkbox_active"></view></view>
|
||||||
<view class="zd-col-3 zd-sec-th"><text>EAS单号</text></view>
|
<view class="zd-col-3 zd-td fontcol1"><text>{{e.a}}</text></view>
|
||||||
<view class="zd-col-2 zd-sec-th"><text>状态</text></view>
|
<view class="zd-col-3 zd-td"><text>{{e.b}}</text></view>
|
||||||
<view class="zd-col-3 zd-sec-th"><text>去向</text></view>
|
<view class="zd-col-2 zd-td"><text class="fontbg1">{{e.c}}</text></view>
|
||||||
<view class="zd-col-3 zd-sec-th"><text>入库日期</text></view>
|
<view class="zd-col-3 zd-td"><text>{{e.d}}</text></view>
|
||||||
<view class="zd-col-3 zd-sec-th"><text>领料人</text></view>
|
<view class="zd-col-3 zd-td"><text>{{e.e}}</text></view>
|
||||||
<view class="zd-col-3 zd-sec-th"><text>制单人</text></view>
|
<view class="zd-col-3 zd-td"><text>{{e.f}}</text></view>
|
||||||
|
<view class="zd-col-3 zd-td"><text>{{e.g}}</text></view>
|
||||||
|
</view>
|
||||||
|
<view v-show="e.checked" class="zd-row zd-sec-table">
|
||||||
|
<view class="zd-col-2 zd-sec-th"><text>序号</text></view>
|
||||||
|
<view class="zd-col-2 zd-sec-th"><view class="zd-checkbox"></view></view>
|
||||||
|
<view class="zd-col-3 zd-sec-th"><text>入库单号</text></view>
|
||||||
|
<view class="zd-col-3 zd-sec-th"><text>EAS单号</text></view>
|
||||||
|
<view class="zd-col-2 zd-sec-th"><text>状态</text></view>
|
||||||
|
<view class="zd-col-3 zd-sec-th"><text>去向</text></view>
|
||||||
|
<view class="zd-col-3 zd-sec-th"><text>入库日期</text></view>
|
||||||
|
<view class="zd-col-3 zd-sec-th"><text>领料人</text></view>
|
||||||
|
<view class="zd-col-3 zd-sec-th"><text>制单人</text></view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
<pagination :total="total" :page-size="queryParams.pageSize" :current-page="queryParams.pageNum" @page-change="handlePageChange" />
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
@@ -62,18 +63,26 @@
|
|||||||
<script>
|
<script>
|
||||||
import NavBar from '@/components/NavBar.vue'
|
import NavBar from '@/components/NavBar.vue'
|
||||||
import SearchBox from '@/components/SearchBox.vue'
|
import SearchBox from '@/components/SearchBox.vue'
|
||||||
import {finishproductPoint, InstoreOrder} from '@/utils/getData2.js'
|
import Pagination from '@/components/Pagination.vue'
|
||||||
|
import {easOutInBillPage} from '@/utils/getData2.js'
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
NavBar,
|
NavBar,
|
||||||
SearchBox
|
SearchBox,
|
||||||
|
Pagination
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
id: '',
|
||||||
val1: '',
|
val1: '',
|
||||||
dataList: [{a: 'IO20213', b: 'SOUT4201', c: '未审核', d: '叉车装配线', e: '2023-06-16', f: '陈晓华', g: 'EAS_钱丽文'}, {a: 'IO20213', b: 'SOUT4201', c: '未审核', d: '叉车装配线', e: '2023-06-16', f: '陈晓华', g: 'EAS_钱丽文'}],
|
dataList: [],
|
||||||
pkId: '',
|
pkId: '',
|
||||||
disabled: false
|
disabled: false,
|
||||||
|
total: 0,
|
||||||
|
queryParams:{
|
||||||
|
pageSize: 0,
|
||||||
|
pageNum: 0
|
||||||
|
}
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
onShow() {
|
onShow() {
|
||||||
@@ -84,7 +93,26 @@
|
|||||||
destroyed () {
|
destroyed () {
|
||||||
this.$store.dispatch('setPublicArr', '')
|
this.$store.dispatch('setPublicArr', '')
|
||||||
},
|
},
|
||||||
|
onLoad (options) {
|
||||||
|
this.id = options.id
|
||||||
|
},
|
||||||
|
created () {
|
||||||
|
this._easOutInBillPage()
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
async _easOutInBillPage () {
|
||||||
|
let res = await easOutInBillPage(this.id)
|
||||||
|
res.result.map(el => {
|
||||||
|
this.$set(el, 'checked', false)
|
||||||
|
})
|
||||||
|
this.dataList = [...res.result]
|
||||||
|
this.total = Number(res.totalElements)
|
||||||
|
this.queryParams.pageSize = Number(res.pageSize)
|
||||||
|
this.queryParams.pageNum = Number(res.pageNum)
|
||||||
|
},
|
||||||
|
handlePageChange(page) {
|
||||||
|
this.queryParams.pageNum = page;
|
||||||
|
},
|
||||||
toDelect () {
|
toDelect () {
|
||||||
this.dataList = []
|
this.dataList = []
|
||||||
this.pkId = ''
|
this.pkId = ''
|
||||||
|
|||||||
BIN
static/images/bg-task-r1.png
Normal file
BIN
static/images/bg-task-r1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
BIN
static/images/bg-task-r2.png
Normal file
BIN
static/images/bg-task-r2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 262 KiB |
BIN
static/images/button_cancle.png
Normal file
BIN
static/images/button_cancle.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
BIN
static/images/button_disabled.png
Normal file
BIN
static/images/button_disabled.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.3 KiB |
BIN
static/images/grid_bg.png
Normal file
BIN
static/images/grid_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
BIN
static/images/hud_left.png
Normal file
BIN
static/images/hud_left.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 52 KiB |
BIN
static/images/hud_right.png
Normal file
BIN
static/images/hud_right.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 52 KiB |
BIN
static/images/icon-check1.png
Normal file
BIN
static/images/icon-check1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 190 B |
BIN
static/images/icon-check2.png
Normal file
BIN
static/images/icon-check2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
static/images/state-item_bg.png
Normal file
BIN
static/images/state-item_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
BIN
static/images/user_icon.png
Normal file
BIN
static/images/user_icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
@@ -21,28 +21,46 @@ export const pdaUpdate = () => request({
|
|||||||
// return res
|
// return res
|
||||||
// }
|
// }
|
||||||
|
|
||||||
// 菜单
|
// 首页显示出入库单据数量
|
||||||
export const authority = () => {
|
// export const getBillsCount = (area) => request({
|
||||||
|
// url:'api/easOutInBill/getBillsCount',
|
||||||
|
// data: {}
|
||||||
|
// })
|
||||||
|
export const getBillsCount = (area) => {
|
||||||
|
let res = [
|
||||||
|
{name: '销售出库', djlx: 'XSCKD', ywlx: 'OUT', counts: '1'},
|
||||||
|
{name: '采购退货出库', djlx: 'CGTHD', ywlx: 'OUT', counts: '1'},
|
||||||
|
{name: '调拨出库', djlx: 'DBCKD', ywlx: 'OUT', counts: '1'},
|
||||||
|
{name: '委外出库', djlx: 'WWFLD', ywlx: 'OUT', counts: '1'},
|
||||||
|
{name: '生产出库', djlx: 'LLCKD', ywlx: 'OUT', counts: '1'},
|
||||||
|
{name: '采购入库', djlx: 'CGRKD', ywlx: 'IN', counts: '1'},
|
||||||
|
{name: '生产退料入库', djlx: 'LLTHD', ywlx: 'IN', counts: '1'},
|
||||||
|
{name: '调拨入库', djlx: 'DBRKD', ywlx: 'IN', counts: '1'},
|
||||||
|
{name: '委外入库', djlx: 'WWRKD', ywlx: 'IN', counts: '1'}
|
||||||
|
]
|
||||||
|
return res
|
||||||
|
}
|
||||||
|
// 1.2分页查询出入库单据
|
||||||
|
// export const easOutInBillPage = (size, page, fuzzy, djlx) => request({
|
||||||
|
// url:'api/easOutInBill/page',
|
||||||
|
// data: {
|
||||||
|
// size: size,
|
||||||
|
// page: page,
|
||||||
|
// fuzzy: fuzzy,
|
||||||
|
// djlx: djlx
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
export const easOutInBillPage = (size, page, fuzzy, djlx) => {
|
||||||
let res = {
|
let res = {
|
||||||
sonTree: [
|
code: '1',
|
||||||
{menu_id: '1', path: 'RF01', name: '入库', router: '/pages/management/in-storage', sonTree: []},
|
desc: '',
|
||||||
{menu_id: '1', path: 'RF02', name: '出库', router: '/pages/management/out-storage', sonTree: []}
|
pageNum: '2',
|
||||||
]
|
pageSize: '10',
|
||||||
|
totalElements: '50',
|
||||||
|
result: [{a: 'IO20213', b: 'SOUT4201', c: '未审核', d: '叉车装配线', e: '2023-06-16', f: '陈晓华', g: 'EAS_钱丽文'}, {a: 'IO20213', b: 'SOUT4201', c: '未审核', d: '叉车装配线', e: '2023-06-16', f: '陈晓华', g: 'EAS_钱丽文'}, {a: 'IO20213', b: 'SOUT4201', c: '未审核', d: '叉车装配线', e: '2023-06-16', f: '陈晓华', g: 'EAS_钱丽文'}, {a: 'IO20213', b: 'SOUT4201', c: '未审核', d: '叉车装配线', e: '2023-06-16', f: '陈晓华', g: 'EAS_钱丽文'}, {a: 'IO20213', b: 'SOUT4201', c: '未审核', d: '叉车装配线', e: '2023-06-16', f: '陈晓华', g: 'EAS_钱丽文'}, {a: 'IO20213', b: 'SOUT4201', c: '未审核', d: '叉车装配线', e: '2023-06-16', f: '陈晓华', g: 'EAS_钱丽文'}, {a: 'IO20213', b: 'SOUT4201', c: '未审核', d: '叉车装配线', e: '2023-06-16', f: '陈晓华', g: 'EAS_钱丽文'}, {a: 'IO20213', b: 'SOUT4201', c: '未审核', d: '叉车装配线', e: '2023-06-16', f: '陈晓华', g: 'EAS_钱丽文'}]
|
||||||
}
|
}
|
||||||
return res
|
return res
|
||||||
}
|
}
|
||||||
// 首页显示出入库单据数量
|
|
||||||
export const getBillsCount = (area) => request({
|
|
||||||
url:'api/easOutInBill/getBillsCount',
|
|
||||||
data: {}
|
|
||||||
})
|
|
||||||
// 1.2指令查询
|
|
||||||
export const inOutExceptionInstQuery = (wcode) => request({
|
|
||||||
url:'api/cacheLineHand/inOutExceptionInstQuery',
|
|
||||||
data: {
|
|
||||||
wcsdevice_code: wcode
|
|
||||||
}
|
|
||||||
})
|
|
||||||
// 1.3确认
|
// 1.3确认
|
||||||
export const inOutExceptionInstConfirm = (wcode, vcode, type) => request({
|
export const inOutExceptionInstConfirm = (wcode, vcode, type) => request({
|
||||||
url:'api/cacheLineHand/inOutExceptionInstConfirm',
|
url:'api/cacheLineHand/inOutExceptionInstConfirm',
|
||||||
|
|||||||
Reference in New Issue
Block a user