|
@@ -1,489 +0,0 @@
|
|
|
-<template>
|
|
|
- <view class="inventory-detail">
|
|
|
- <!-- 导航栏 -->
|
|
|
- <u-navbar
|
|
|
- :title="pageTitle"
|
|
|
- :autoBack="true"
|
|
|
- fixed
|
|
|
- safe-area-inset-top
|
|
|
- placeholder
|
|
|
- >
|
|
|
- <template #right>
|
|
|
- <view class="nav-right">
|
|
|
- <u-icon name="search" size="20" color="#333"></u-icon>
|
|
|
- </view>
|
|
|
- </template>
|
|
|
- </u-navbar>
|
|
|
-
|
|
|
- <!-- 基本信息 吸顶 -->
|
|
|
- <view class="info-card">
|
|
|
- <view class="info-item">
|
|
|
- <text class="info-label">盘点单号:</text>
|
|
|
- <text class="info-value">{{ inventoryInfo.code }}</text>
|
|
|
- </view>
|
|
|
- <view class="info-item">
|
|
|
- <text class="info-label">盘点人:</text>
|
|
|
- <text class="info-value">{{ inventoryInfo.operator }}</text>
|
|
|
- </view>
|
|
|
- <view class="progress-box">
|
|
|
- <view class="progress-label-box">
|
|
|
- <text class="progress-label"> 盘点进度 </text>
|
|
|
- <text class="progress-value"
|
|
|
- >{{ inventoryInfo.progress }}/{{ inventoryInfo.total }}</text
|
|
|
- >
|
|
|
- </view>
|
|
|
- <view class="progress-bar-wrap">
|
|
|
- <u-line-progress
|
|
|
- :percentage="getProgressPercentage"
|
|
|
- height="4"
|
|
|
- :show-text="false"
|
|
|
- activeColor="#4080FF"
|
|
|
- >
|
|
|
- </u-line-progress>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 筛选按钮 -->
|
|
|
- <u-sticky bgColor="#F5F6F7" :offsetTop="44">
|
|
|
- <view class="filter-wrap">
|
|
|
- <view class="filter-btn" @click="filterPopupVisible = true">
|
|
|
- <text>筛选</text>
|
|
|
- <image
|
|
|
- src="@/static/image/saixuan-icon.png"
|
|
|
- mode=""
|
|
|
- class="icon"
|
|
|
- ></image>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </u-sticky>
|
|
|
-
|
|
|
- <!-- 商品列表 -->
|
|
|
- <view class="goods-list">
|
|
|
- <view class="goods-item" v-for="(item, index) in goodsList" :key="index">
|
|
|
- <view class="location-row">
|
|
|
- <view class="location-left">
|
|
|
- <text class="location-label">库位:</text>
|
|
|
- <text class="location-value">{{ item.location }}</text>
|
|
|
- <image
|
|
|
- src="@/static/image/bianji-icon.png"
|
|
|
- mode=""
|
|
|
- class="icon"
|
|
|
- ></image>
|
|
|
- </view>
|
|
|
- <text class="category-text">{{ item.category }}</text>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="goods-content">
|
|
|
- <image
|
|
|
- class="goods-image"
|
|
|
- :src="item.image"
|
|
|
- mode="aspectFill"
|
|
|
- ></image>
|
|
|
- <view class="goods-info">
|
|
|
- <text class="goods-name u-line-2">{{ item.name }}</text>
|
|
|
- <view class="goods-field half-w">
|
|
|
- <text class="field-label">规格:</text>
|
|
|
- <text class="field-value">{{ item.spec }}</text>
|
|
|
- </view>
|
|
|
- <view class="goods-field half-w">
|
|
|
- <text class="field-label">盘点人:</text>
|
|
|
- <text class="field-value">{{ item.checkUser }}</text>
|
|
|
- </view>
|
|
|
- <view class="goods-field">
|
|
|
- <text class="field-label">盘点时间:</text>
|
|
|
- <text class="field-value">{{ item.checkTime }}</text>
|
|
|
- </view>
|
|
|
- <view class="stock-row">
|
|
|
- <view class="stock-item">
|
|
|
- <text class="stock-label">系统库存</text>
|
|
|
- <text class="stock-value">{{ item.systemStock }}瓶</text>
|
|
|
- </view>
|
|
|
- <view class="stock-item">
|
|
|
- <text class="stock-label">已盘库存</text>
|
|
|
- <text
|
|
|
- class="stock-value"
|
|
|
- :class="{
|
|
|
- 'stock-value-zero': item.actualStock === '未盘',
|
|
|
- 'stock-value-warning': item.actualStock === '0瓶',
|
|
|
- }"
|
|
|
- >{{ item.actualStock }}</text
|
|
|
- >
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="action-row">
|
|
|
- <u-button
|
|
|
- type="primary"
|
|
|
- size="mini"
|
|
|
- @click="handleCheck(item)"
|
|
|
- class="action-btn"
|
|
|
- >盘点</u-button
|
|
|
- >
|
|
|
- <u-button
|
|
|
- type="primary"
|
|
|
- size="mini"
|
|
|
- @click="handleRecheck(item)"
|
|
|
- class="action-btn"
|
|
|
- >重新盘点
|
|
|
- </u-button>
|
|
|
- <u-button
|
|
|
- type="warning"
|
|
|
- size="mini"
|
|
|
- plain
|
|
|
- @click="handleCheck2(item)"
|
|
|
- class="action-btn action-btn-secondary"
|
|
|
- >盘亏</u-button
|
|
|
- >
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <InventoryFilterPopup
|
|
|
- :show.sync="filterPopupVisible"
|
|
|
- :defaultValues="defaultFilterValues"
|
|
|
- @confirm="handleFilterConfirm"
|
|
|
- />
|
|
|
- <actionNumPopup :show.sync="actionPop.showNumPop" />
|
|
|
- <categoryPopup :show.sync="actionPop.showCategoryPop" />
|
|
|
- <error-pop
|
|
|
- v-model="actionPop.errorShow"
|
|
|
- isCenter
|
|
|
- cancelBtnText="取消"
|
|
|
- confirmBtnText="确定"
|
|
|
- @close="actionPop.errorShow = false"
|
|
|
- @confirm="confirm"
|
|
|
- :content="actionPop.errorText"
|
|
|
- ></error-pop>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import InventoryFilterPopup from "./components/inventoryFilterPopup.vue";
|
|
|
-import actionNumPopup from "./components/actionNumPopup.vue";
|
|
|
-import categoryPopup from "./components/categoryPopup.vue";
|
|
|
-import errorPop from "@/components/error-pop/error-pop.vue";
|
|
|
-
|
|
|
-export default {
|
|
|
- components: {
|
|
|
- InventoryFilterPopup,
|
|
|
- actionNumPopup,
|
|
|
- errorPop,
|
|
|
- categoryPopup,
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- pageTitle: "2025年中心仓第三季度食品盘点",
|
|
|
- loadMoreStatus: "loadmore", //加载前值为loadmore,加载中为loading,没有数据为nomore
|
|
|
- pageNum: 1,
|
|
|
- pageSize: 10,
|
|
|
- inventoryInfo: {
|
|
|
- code: "2024202244",
|
|
|
- operator: "刘双秀",
|
|
|
- progress: 105,
|
|
|
- total: 604,
|
|
|
- },
|
|
|
- goodsList: [
|
|
|
- {
|
|
|
- location: "C6-2-2",
|
|
|
- category: "母婴用品-家居旅行",
|
|
|
- image: "/static/demo/goods1.png",
|
|
|
- name: "4层汗巾儿童全棉幼儿类吸汗巾婴儿纱布毛巾1条装",
|
|
|
- spec: "4层-随机",
|
|
|
- checkUser: "刘双秀",
|
|
|
- checkTime: "2025-04-03",
|
|
|
- systemStock: "5瓶",
|
|
|
- actualStock: "未盘",
|
|
|
- isChecked: false,
|
|
|
- },
|
|
|
- {
|
|
|
- location: "C6-2-2",
|
|
|
- category: "母婴用品-家居旅行",
|
|
|
- image: "/static/demo/goods1.png",
|
|
|
- name: "4层汗巾儿童全棉幼儿类吸汗巾婴儿纱布毛巾1条装",
|
|
|
- spec: "4层-随机",
|
|
|
- checkUser: "刘双秀",
|
|
|
- checkTime: "2025-04-03",
|
|
|
- systemStock: "5瓶",
|
|
|
- actualStock: "0瓶",
|
|
|
- isChecked: true,
|
|
|
- },
|
|
|
- ],
|
|
|
- filterPopupVisible: false,
|
|
|
- defaultFilterValues: {
|
|
|
- goods: "",
|
|
|
- user: "",
|
|
|
- category: "",
|
|
|
- location: "",
|
|
|
- },
|
|
|
- actionPop: {
|
|
|
- // 盘点数量弹框状态
|
|
|
- showNumPop: false,
|
|
|
- // 警告提示弹框状态
|
|
|
- errorShow: false,
|
|
|
- errorText: "是否提交盘点?",
|
|
|
- // 修改库位弹框状态
|
|
|
- showCategoryPop: false,
|
|
|
- },
|
|
|
- };
|
|
|
- },
|
|
|
- computed: {
|
|
|
- getProgressPercentage() {
|
|
|
- return (this.inventoryInfo.progress / this.inventoryInfo.total) * 100;
|
|
|
- },
|
|
|
- },
|
|
|
- onLoad(opt) {
|
|
|
- console.log("222222", opt);
|
|
|
- // 初始化数据
|
|
|
- // this.loadData(opt.id);
|
|
|
- },
|
|
|
- methods: {
|
|
|
- async loadData(id) {
|
|
|
- try {
|
|
|
- } catch (error) {}
|
|
|
- },
|
|
|
- handleCheck(item) {
|
|
|
- uni.showToast({
|
|
|
- title: "开始盘点",
|
|
|
- icon: "none",
|
|
|
- });
|
|
|
- },
|
|
|
- handleRecheck(item) {
|
|
|
- uni.showToast({
|
|
|
- title: "开始重新盘点",
|
|
|
- icon: "none",
|
|
|
- });
|
|
|
- },
|
|
|
- handleCheck2(item) {
|
|
|
- uni.showToast({
|
|
|
- title: "开始盘点2",
|
|
|
- icon: "none",
|
|
|
- });
|
|
|
- },
|
|
|
- handleFilterConfirm(values) {
|
|
|
- this.defaultFilterValues = values;
|
|
|
- this.filterPopupVisible = false;
|
|
|
- },
|
|
|
- },
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss">
|
|
|
-.inventory-detail {
|
|
|
- min-height: 100vh;
|
|
|
- background-color: #f0f6fb;
|
|
|
- padding-bottom: 40rpx;
|
|
|
-
|
|
|
- .nav-right {
|
|
|
- padding: 0 24rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .info-card {
|
|
|
- background-color: #fff;
|
|
|
- padding: 16rpx 32rpx;
|
|
|
-
|
|
|
- .info-item {
|
|
|
- display: flex;
|
|
|
- font-size: 28rpx;
|
|
|
- margin-bottom: 10rpx;
|
|
|
-
|
|
|
- .info-label {
|
|
|
- color: #666;
|
|
|
- margin-right: 8rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .info-value {
|
|
|
- color: #333;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .progress-box {
|
|
|
- .progress-label-box {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- }
|
|
|
-
|
|
|
- .progress-label {
|
|
|
- font-size: 28rpx;
|
|
|
- color: #666;
|
|
|
- display: block;
|
|
|
- margin-bottom: 16rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .progress-bar-wrap {
|
|
|
- margin-bottom: 16rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .progress-value {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #4080ff;
|
|
|
- display: block;
|
|
|
- text-align: right;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .filter-wrap {
|
|
|
- display: flex;
|
|
|
- justify-content: flex-end;
|
|
|
- padding: 20rpx;
|
|
|
-
|
|
|
- .filter-btn {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- border-radius: 8rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #333333;
|
|
|
-
|
|
|
- .icon {
|
|
|
- margin-left: 8rpx;
|
|
|
- width: 32rpx;
|
|
|
- height: 32rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .goods-list {
|
|
|
- width: 710rpx;
|
|
|
- margin: 0 20rpx;
|
|
|
- border-radius: 16rpx;
|
|
|
-
|
|
|
- .goods-item {
|
|
|
- background-color: #fff;
|
|
|
- overflow: hidden;
|
|
|
- border-bottom: 1px solid #f5f6f7;
|
|
|
-
|
|
|
- .location-row {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- padding: 24rpx 32rpx;
|
|
|
- border-bottom: 1px solid #f5f6f7;
|
|
|
- gap: 40rpx;
|
|
|
-
|
|
|
- .location-left {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .location-label {
|
|
|
- font-size: 28rpx;
|
|
|
- color: #333;
|
|
|
- }
|
|
|
-
|
|
|
- .location-value {
|
|
|
- font-size: 28rpx;
|
|
|
- color: #4080ff;
|
|
|
- margin: 0 8rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .icon {
|
|
|
- width: 32rpx;
|
|
|
- height: 32rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .category-text {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #999;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .goods-content {
|
|
|
- padding: 24rpx 32rpx;
|
|
|
- display: flex;
|
|
|
-
|
|
|
- .goods-image {
|
|
|
- width: 160rpx;
|
|
|
- flex-basis: 160rpx;
|
|
|
- height: 160rpx;
|
|
|
- border-radius: 8rpx;
|
|
|
- background-color: #f5f6f7;
|
|
|
- }
|
|
|
-
|
|
|
- .goods-info {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- flex: 1;
|
|
|
- margin-left: 24rpx;
|
|
|
-
|
|
|
- .half-w {
|
|
|
- width: 50%;
|
|
|
- }
|
|
|
-
|
|
|
- .goods-name {
|
|
|
- font-size: 28rpx;
|
|
|
- line-height: 1.4;
|
|
|
- color: #333;
|
|
|
- margin-bottom: 16rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .goods-field {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #666;
|
|
|
- margin-bottom: 16rpx;
|
|
|
-
|
|
|
- .field-label {
|
|
|
- color: #999;
|
|
|
- }
|
|
|
-
|
|
|
- .field-value {
|
|
|
- color: #666;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .stock-row {
|
|
|
- display: grid;
|
|
|
- grid-template-columns: 50% 50%;
|
|
|
- width: 100%;
|
|
|
- padding: 24rpx;
|
|
|
- background-color: #f6f8fa;
|
|
|
- border-radius: 8rpx;
|
|
|
-
|
|
|
- .stock-item {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
-
|
|
|
- .stock-label {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #999;
|
|
|
- margin-bottom: 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .stock-value {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #333;
|
|
|
-
|
|
|
- &-zero {
|
|
|
- color: #999;
|
|
|
- }
|
|
|
-
|
|
|
- &-warning {
|
|
|
- color: #ff9900;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .action-row {
|
|
|
- padding: 0 32rpx 32rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: flex-end;
|
|
|
- gap: 24rpx;
|
|
|
-
|
|
|
- .action-btn {
|
|
|
- width: 140rpx;
|
|
|
- height: 56rpx;
|
|
|
- padding: 0;
|
|
|
-
|
|
|
- &-secondary {
|
|
|
- background-color: transparent;
|
|
|
- border-color: #ff9900;
|
|
|
- color: #ff9900;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|