Skip to content

梁建民 / wmsMin

Go to a project
Commit bbd653f6 by LJM
Options

css

parent c72f5fbb
Inline Side-by-side
Showing with 922 additions and 0 deletions
assets/css/tally/goods.scss 0 → 100644
.page-box {
padding: 15rpx 22rpx;
.search-box {
height: 60rpx;
background: #ffffff;
border-radius: 10rpx;
padding: 0 18rpx 0 0;
.sn {
width: 164rpx;
height: 35rpx;
border-right: 1px solid #f0f0f2;
.uni-input {
font-size: 18rpx;
color: #292b33;
font-weight: bold;
}
.uni-arrow {
width: 14rpx;
height: 9rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/10/e4c72319ad41ce1425f71cc6ec35f111.png') no-repeat center;
background-size: contain;
margin-left: 12rpx;
}
}
.search-bar {
width: calc(100% - 164rpx);
.icon-juxing11 {
font-size: 30rpx;
color: #919399;
margin-left: 17rpx;
margin-right: 13rpx;
}
.uni-input {
font-size: 18rpx;
color: #484b59;
}
.icon-a-juxing111 {
font-size: 30rpx;
color: #c6c7cc;
}
}
}
.total-text {
margin-top: 15rpx;
font-size: 16rpx;
color: #919399;
text-align: right;
text {
padding: 0 5rpx;
color: #1969f9;
}
}
.list {
margin-top: 15rpx;
padding-bottom: 100rpx;
.box {
position: relative;
padding: 15px 17rpx 18rpx 17rpx;
background: #ffffff;
box-shadow: 0px 3rpx 3rpx 0px rgba(198, 199, 204, 0.3);
border-radius: 10rpx;
margin-bottom: 15rpx;
flex-wrap: wrap;
border: 1px solid transparent;
.check-box-icon {
position: absolute;
right: 18rpx;
top: 17rpx;
width: 20rpx;
height: 20rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/11/0bf30da3e8ce6c476c210173b5f13d51.png') no-repeat center;
background-size: contain;
display: block;
}
&.curr {
border: 1px solid #1969f9;
.check-box-icon {
background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center;
background-size: contain;
}
}
.input-box {
margin-bottom: 11rpx;
flex: 0 0 50%;
.bor {
height: 1px;
background-color: #f0f0f2;
color: #f0f0f2;
margin-bottom: 10rpx;
}
.label {
width: 114rpx;
font-size: 17rpx;
color: #919399;
white-space: nowrap;
}
.text {
font-size: 17rpx;
color: #484b59;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.desc {
font-size: 17rpx;
color: #484b59;
word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.tt {
font-size: 17rpx;
color: #1969f9;
}
.pick_img_list {
flex-wrap: wrap;
.default {
width: 120rpx;
height: 120rpx;
background: #f5f5f7;
border-radius: 10rpx;
margin-right: 15rpx;
.iconfont {
font-size: 60rpx;
color: #c6c7cc;
}
}
.img_list {
position: relative;
width: 120rpx;
height: 120rpx;
background: #f5f5f7;
border-radius: 10rpx;
margin-right: 15rpx;
margin-bottom: 15rpx;
image {
width: 120rpx;
height: 120rpx;
}
.iconfont {
position: absolute;
right: 0;
top: 0;
font-size: 30rpx;
color: #ff3700;
z-index: 9;
}
}
}
}
.btn-box {
position: absolute;
right: 17rpx;
bottom: 13rpx;
.btn1 {
width: 75rpx;
height: 30rpx;
background: #fff;
border-radius: 8rpx;
font-size: 15rpx;
color: #f00;
border: 1px solid #f00;
margin-right: 10rpx;
}
.btn2 {
width: 68rpx;
height: 30rpx;
background: #1969f9;
border-radius: 8rpx;
font-size: 15rpx;
color: #ffffff;
}
}
.status-box {
position: absolute;
right: 10rpx;
top: 5rpx;
.staus_type_val {
font-size: 17rpx;
color: #1969f9;
border: 1px solid #f0f0f2;
width: 45rpx;
height: 45rpx;
border-radius: 50%;
margin-right: 10rpx;
}
}
}
}
.fix-btn {
position: fixed;
bottom: 0;
width: 100%;
left: 0;
z-index: 999;
.btn1 {
width: 128rpx;
height: 75rpx;
background: #ffffff;
border-right: 1px solid #f0f0f2;
.check-box-icon {
width: 20rpx;
height: 20rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/11/0bf30da3e8ce6c476c210173b5f13d51.png') no-repeat center;
background-size: contain;
display: block;
&.curr {
background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center;
background-size: contain;
}
}
.text {
margin-left: 10rpx;
font-size: 20rpx;
color: #484b59;
}
}
.btn2 {
width: 300rpx;
height: 75rpx;
background: #02a7f0;
font-size: 23rpx;
color: #ffffff;
}
.btn3 {
width: calc(100% - 428rpx);
height: 75rpx;
background: #1969f9;
font-size: 23rpx;
color: #ffffff;
}
}
}
.no-date {
padding: 30rpx 0;
.iconfont {
font-size: 180rpx;
color: #c6c7cc;
margin-bottom: 30rpx;
}
.text {
font-size: 20rpx;
color: #484b59;
}
}
::v-deep .uni-drawer__content {
width: 85% !important;
}
assets/css/tally/goodsDetail.scss 0 → 100644
.page-box {
padding: 15rpx 22rpx;
.search-box {
height: 60rpx;
background: #ffffff;
border-radius: 10rpx;
padding: 0 18rpx 0 0;
.sn {
width: 164rpx;
height: 35rpx;
border-right: 1px solid #f0f0f2;
.uni-input {
font-size: 18rpx;
color: #292b33;
font-weight: bold;
}
.uni-arrow {
width: 14rpx;
height: 9rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/10/e4c72319ad41ce1425f71cc6ec35f111.png') no-repeat center;
background-size: contain;
margin-left: 12rpx;
}
}
.search-bar {
width: calc(100% - 164rpx);
.icon-juxing11 {
font-size: 30rpx;
color: #919399;
margin-left: 17rpx;
margin-right: 13rpx;
}
.uni-input {
font-size: 18rpx;
color: #484b59;
}
.icon-a-juxing111 {
font-size: 30rpx;
color: #c6c7cc;
}
}
}
.total-text {
font-size: 16rpx;
color: #919399;
text-align: right;
text {
padding: 0 5rpx;
color: #1969f9;
}
}
.show-text {
.label {
width: 80rpx;
font-size: 17rpx;
color: #919399;
text-align: right;
}
.text {
font-size: 17rpx;
color: #484b59;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
}
.list {
margin-top: 15rpx;
padding-bottom: 100rpx;
.box {
position: relative;
padding: 15px 17rpx 18rpx 17rpx;
background: #ffffff;
box-shadow: 0px 3rpx 3rpx 0px rgba(198, 199, 204, 0.3);
border-radius: 10rpx;
margin-bottom: 15rpx;
flex-wrap: wrap;
border: 1px solid transparent;
.num {
position: absolute;
left: 17rpx;
top: 10rpx;
font-size: 17rpx;
color: #484b59;
}
.check-box-icon {
position: absolute;
right: 18rpx;
top: 17rpx;
width: 20rpx;
height: 20rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/11/0bf30da3e8ce6c476c210173b5f13d51.png') no-repeat center;
background-size: contain;
display: block;
}
&.curr {
border: 1px solid #1969f9;
.check-box-icon {
background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center;
background-size: contain;
}
}
.input-box {
margin-bottom: 11rpx;
flex: 0 0 50%;
.bor {
height: 1px;
background-color: #f0f0f2;
color: #f0f0f2;
margin-bottom: 10rpx;
}
.label {
width: 114rpx;
font-size: 17rpx;
color: #919399;
white-space: nowrap;
}
.text {
font-size: 17rpx;
color: #484b59;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.desc {
font-size: 17rpx;
color: #484b59;
word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.tt {
font-size: 17rpx;
color: #1969f9;
}
.pick_img_list {
flex-wrap: wrap;
.default {
width: 120rpx;
height: 120rpx;
background: #f5f5f7;
border-radius: 10rpx;
margin-right: 15rpx;
.iconfont {
font-size: 60rpx;
color: #c6c7cc;
}
}
.img_list {
position: relative;
width: 120rpx;
height: 120rpx;
background: #f5f5f7;
border-radius: 10rpx;
margin-right: 15rpx;
margin-bottom: 15rpx;
image {
width: 120rpx;
height: 120rpx;
}
.iconfont {
position: absolute;
right: 0;
top: 0;
font-size: 30rpx;
color: #ff3700;
z-index: 9;
}
}
}
}
.btn-box {
position: absolute;
right: 17rpx;
bottom: 13rpx;
.btn1 {
width: 75rpx;
height: 30rpx;
background: #fff;
border-radius: 8rpx;
font-size: 15rpx;
color: #f00;
border: 1px solid #f00;
margin-right: 10rpx;
}
.btn2 {
width: 68rpx;
height: 30rpx;
background: #1969f9;
border-radius: 8rpx;
font-size: 15rpx;
color: #ffffff;
}
}
.status-box {
position: absolute;
right: 10rpx;
top: 5rpx;
.staus_type_val {
font-size: 17rpx;
color: #1969f9;
border: 1px solid #f0f0f2;
width: 45rpx;
height: 45rpx;
border-radius: 50%;
margin-right: 10rpx;
}
}
}
}
.fix-btn {
position: fixed;
bottom: 0;
width: 100%;
left: 0;
z-index: 999;
.btn1 {
width: 128rpx;
height: 75rpx;
background: #ffffff;
border-right: 1px solid #f0f0f2;
.check-box-icon {
width: 20rpx;
height: 20rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/11/0bf30da3e8ce6c476c210173b5f13d51.png') no-repeat center;
background-size: contain;
display: block;
&.curr {
background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center;
background-size: contain;
}
}
.text {
margin-left: 10rpx;
font-size: 20rpx;
color: #484b59;
}
}
.btn2 {
width: 300rpx;
height: 75rpx;
background: #02a7f0;
font-size: 23rpx;
color: #ffffff;
}
.btn3 {
width: calc(100% - 428rpx);
height: 75rpx;
background: #1969f9;
font-size: 23rpx;
color: #ffffff;
}
}
}
.no-date {
padding: 30rpx 0;
.iconfont {
font-size: 180rpx;
color: #c6c7cc;
margin-bottom: 30rpx;
}
.text {
font-size: 20rpx;
color: #484b59;
}
}
::v-deep .uni-drawer__content {
width: 85% !important;
}
pages/tally/goods.vue 0 → 100644
<template>
<view class="page-box">
<!-- 搜索参数 -->
<view class="search-box row bothSide verCenter">
<view class="sn row rowCenter verCenter">
<picker @change="bindPickerChange($event,1)" :value="index" :range="array">
<view class="row verCenter">
<view class="uni-input">{{ array[index] }}</view>
<view class="uni-arrow"></view>
</view>
</picker>
</view>
<view class="search-bar row bothSide verCenter">
<view class="row verCenter" style="width: 100%;">
<text class="iconfont icon-juxing11"></text>
<input class="uni-input" placeholder="输入型号或入仓号或理货批次号查询" placeholder-style="color:#919399" :focus="is_focus" v-model="searchParams.all_search" @input="handleInput" style="width: 100%;" />
</view>
<text class="iconfont icon-a-juxing111" @click="clearInput()" v-if="input_flag"></text>
</view>
</view>
<view class="total-text" v-if="list.length > 0">共<text>{{total}}</text>条数据</view>
<!-- 列表区 -->
<view class="list" v-if="list.length > 0">
<view class="box row" v-for="(item, index) in list" :key="index">
<view class="status-box row">
<template v-if="item.box_type == 0">
<view class="staus_type_val row rowCenter verCenter">{{item.box_type_cn}}</view>
</template>
<template v-else>
<view class="staus_type_val row rowCenter verCenter" style="border: 1px solid red;color: red;">{{item.box_type_cn}}</view>
</template>
</view>
<view class="input-box row verCenter curr" style="flex: 0 0 100%;">
<text class="tt" style="color: #000;font-weight: bold;">{{ item.box_sn }}</text>
<text class="tt" style="margin-left: 50px;width: 100rpx;">{{item.tally_status_cn}}</text>
</view>
<view class="input-box row verCenter">
<text class="label">入仓号数：</text>
<text class="text">{{ item.erp_order_sn_num }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">型号数：</text>
<text class="text">{{ item.goods_type_num }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">总净重：</text>
<text class="text">{{ item.net_weight_sum }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">总毛重：</text>
<text class="text">{{ item.gross_weight }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">更新时间：</text>
<text class="text">{{ item.update_time_cn }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">更新人：</text>
<text class="text">{{ item.update_user_name }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">封箱时间：</text>
<text class="text">{{ item.close_time_cn }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">封箱人：</text>
<text class="text">{{ item.tally_user_name }}</text>
</view>
<view class="btn-box row">
<navigator class="btn2 row rowCenter verCenter" :url="'/pages/tally/goodsDetail?wsty_id='+item.wsty_id+'&box_sn='+item.box_sn+'&box_type='+item.box_type+'&tally_status_cn='+item.tally_status_cn">详情</navigator>
</view>
</view>
</view>
<!-- 无数据展示 -->
<view class="no-date column rowCenter verCenter" v-else>
<text class="iconfont icon-a-juxing21"></text>
<text class="text">查不到当前数据</text>
</view>
</view>
</template>
<script>
import { API } from '@/util/api.js';
import debounce from 'lodash/debounce';
export default {
data() {
return {
page: 1,
limit: 30,
list: [],
index: 0,
array: ['全量搜索'],
detail: {}, //详情
input_flag: false,
total: 0,
is_focus: true, //获取焦点动态化
hasMoreData: true, //是否分页加载
searchParams: {
all_search: ''
}
};
},
onReachBottom() {
if (!this.hasMoreData) {
return;
}
this.page++;
this.getData();
},
onShow() {
this.getData();
},
methods: {
getData() {
this.request(API.getBoxData, 'GET', { page: this.page, limit: this.limit, ...this.searchParams }, true).then(res => {
if (res.err_code === 0) {
this.total = res.data.total;
if (res.data.data.length > 0) {
this.hasMoreData = true;
this.list = this.list.concat(res.data.data);
} else {
this.hasMoreData = false;
}
} else {
uni.showToast({
title: res.err_msg,
icon: 'none'
});
}
});
},
/**
* 清空数据
*/
clearInput() {
this.resetChange();
this.searchParams.all_search = '';
this.input_flag = false;
this.clearInputAndFocus();
this.getData();
},
/**
* 全量搜索
* @param {Object} event
*/
handleInput: debounce(function(event) {
this.resetChange();
var val = event.target.value;
this.searchParams.all_search = '';
if (val) {
this.searchParams.all_search = val;
this.input_flag = true;
} else {
this.input_flag = false;
}
this.getData();
}, 500),
/**
* 重置
*/
resetChange() {
this.list = [];
this.page = 1;
},
/**
* 再次获取焦点
*/
clearInputAndFocus() {
this.input_flag = false; //关闭叉叉
this.is_focus = false;
setTimeout(() => {
this.is_focus = true;
}, 200);
},
}
};
</script>
<style scoped lang="scss">
@import '@/assets/css/tally/goods.scss';
</style>
\ No newline at end of file
pages/tally/goodsDetail.vue 0 → 100644
<template>
<view class="page-box">
<!-- 搜索参数 -->
<view class="search-box row bothSide verCenter">
<view class="sn row rowCenter verCenter">
<picker @change="bindPickerChange($event,1)" :value="index" :range="array">
<view class="row verCenter">
<view class="uni-input">{{ array[index] }}</view>
<view class="uni-arrow"></view>
</view>
</picker>
</view>
<view class="search-bar row bothSide verCenter">
<view class="row verCenter" style="width: 100%;">
<text class="iconfont icon-juxing11"></text>
<input class="uni-input" placeholder="输入型号或入仓号或理货批次号查询" placeholder-style="color:#919399" :focus="is_focus" v-model="searchParams.all_search" @input="handleInput" style="width: 100%;" />
</view>
<text class="iconfont icon-a-juxing111" @click="clearInput()" v-if="input_flag"></text>
</view>
</view>
<view class="row bothSide verCenter" style="margin-top: 15rpx;">
<view class="row show-text">
<view class="row" style="margin-right: 50rpx;">
<text class="label">箱状态：</text>
<text class="text">{{tally_status_cn}}</text>
</view>
<view class="row">
<text class="label">装货类型：</text>
<text class="text">{{box_type_cn[box_type]}}</text>
</view>
</view>
<view class="total-text" v-if="list.length > 0">共<text>{{total}}</text>条数据</view>
</view>
<!-- 列表区 -->
<view class="list" v-if="list.length > 0">
<view class="box row" v-for="(item, index) in list" :key="index">
<text class="num">{{index+1}}、</text>
<view class="status-box row">
<view class="staus_type_val row rowCenter verCenter" v-if="item.is_goods_check">商检</view>
</view>
<view class="input-box row verCenter" style="flex: 00 100%;">
<text class="label">异常批次号：</text>
<text class="text">{{item.abnormal_batch}}</text>
</view>
<view class="input-box row verCenter">
<text class="label">型号：</text>
<text class="text">{{ item.goods_type }}</text>
</view>
<view class="input-box row verCenter">
<text class="tt">{{ item.sync_status_cn }}</text>
</view>
<view class="input-box row verCenter" style="flex: 00 100%;">
<text class="label">物料名称：</text>
<text class="text">{{item.goods_title}}</text>
</view>
<view class="input-box row verCenter" style="flex: 00 100%;">
<text class="label">品牌：</text>
<text class="text">{{ item.brand }}</text>
</view>
<view class="input-box row verCenter" style="flex: 00 100%;">
<text class="label">数量：</text>
<text class="text">{{item.order_numbers}}</text>
</view>
<view class="input-box row verCenter" style="flex: 00 100%;">
<text class="label">原产地：</text>
<text class="text">{{item.origin}}</text>
</view>
<view class="input-box row verCenter" style="flex: 00 100%;">
<text class="label">净重：</text>
<text class="text">{{ item.net_weight }}</text>
</view>
<view class="input-box row verCenter" style="flex: 00 100%;">
<text class="label">理货备注：</text>
<text class="text">{{ item.remark }}</text>
</view>
<view class="input-box row" style="flex: 0 0 100%;">
<text class="label">理货照片：</text>
<view class="pick_img_list row">
<template v-if="item.goods_check_pic">
<view class="img_list" v-for="(v, i) in item.goods_check_pic.split(',')" :key="i">
<image :src="v" mode="aspectFill" @click="previewChange(item.goods_check_pic.split(','),i)"></image>
</view>
</template>
</view>
</view>
</view>
</view>
<!-- 无数据展示 -->
<view class="no-date column rowCenter verCenter" v-else>
<text class="iconfont icon-a-juxing21"></text>
<text class="text">查不到当前数据</text>
</view>
</view>
</template>
<script>
import { API } from '@/util/api.js';
import debounce from 'lodash/debounce';
export default {
data() {
return {
noexebshowFalg: true, //控制是否会触发生命周期
wsty_id: '',
box_sn: '',
box_type: '',
box_type_cn: ['普货', '美产', '商检'],
tally_status_cn: '',
total: 0,
page: 1,
limit: 1000,
list: [],
index: 0,
array: ['全量搜索'],
detail: {}, //详情
input_flag: false,
is_focus: true, //获取焦点动态化
searchParams: {
all_search: ''
}
};
},
onLoad(options) {
this.wsty_id = options.wsty_id || '';
this.box_sn = options.box_sn || '';
this.box_type = options.box_type || '';
this.tally_status_cn = options.tally_status_cn || '';
},
onShow() {
this.resetChange();
this.getData();
},
methods: {
getData() {
this.request(API.getTallyData, 'GET', { wsty_id: this.wsty_id, ...this.searchParams }, true).then(res => {
if (res.err_code === 0) {
uni.setNavigationBarTitle({
title: this.box_sn
});
this.list = res.data.detail;
this.total = res.data.detail.length;
} else {
uni.showToast({
title: res.err_msg,
icon: 'none'
});
}
});
},
/**
* 清空数据
*/
clearInput() {
this.resetChange();
this.searchParams.all_search = '';
this.input_flag = false;
this.clearInputAndFocus();
this.getData();
},
/**
* 全量搜索
* @param {Object} event
*/
handleInput: debounce(function(event) {
this.resetChange();
var val = event.target.value;
this.searchParams.all_search = '';
if (val) {
this.searchParams.all_search = val;
this.input_flag = true;
} else {
this.input_flag = false;
}
this.getData();
}, 500),
/**
* 重置
*/
resetChange() {
this.list = [];
this.page = 1;
},
/**
* 再次获取焦点
*/
clearInputAndFocus() {
this.input_flag = false; //关闭叉叉
this.is_focus = false;
setTimeout(() => {
this.is_focus = true;
}, 200);
},
/**
* 预览图片
* @param {Object} img
* @param {Object} index
*/
previewChange(arr, index) {
this.noexebshowFalg = false;
uni.previewImage({
current: index,
urls: arr
});
}
}
};
</script>
<style scoped lang="scss">
@import '@/assets/css/tally/goodsDetail.scss';
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment