入库流程对接完毕

This commit is contained in:
zx
2026-04-03 08:38:34 +08:00
parent dde27ed688
commit ce6d5e5d6e
42 changed files with 3028 additions and 936 deletions

View File

@@ -0,0 +1,236 @@
<!-- 仓库/存储区选择 -->
<template>
<view class="content">
<view class="topSearch">
<uni-easyinput type="text" v-model="queryParams.keyword" prefixIcon="search" :inputBorder="false"
@iconClick="getList" placeholder="请输入搜索内容" />
</view>
<!-- 仓库/存储列表 -->
<z-paging ref="pagingRef" class="containerBox" v-model="infoList" @query="getList">
<uni-list class="listBox">
<uni-list-item v-for="item in infoList" :key="item.id" clickable @click="onChecked(item)">
<template v-slot:body>
<view style="display: flex; flex-direction: column; width: 100%;" v-if="isWarehousing">
<view class="line title">
<p>仓库名称</p>
<p>{{ item.deptName }}</p>
</view>
<view class="line content">
<p>仓库编码</p>
<p>{{ item.deptId }}</p>
</view>
<!-- todo 以下两个字段pc未维护暂时注释 -->
<!-- <view class=" line content">
<p>仓库类型</p>
<p></p>
</view>
<view class="line content">
<p>仓库位置</p>
<p></p>
</view> -->
<view class="line content">
<p>备注</p>
<p>
<span v-if="item?.remark"></span>
<span v-else class="empty">未填写</span>
</p>
</view>
</view>
<view v-else style="display: flex; flex-direction: column;width: 100%;">
<view class="line title">
<p>{{ item.deptName }} {{ item.deptId }}</p>
</view>
<view class="line content">
<p>
<span v-if="item?.remark">{{ item?.remark }}</span>
<span v-else class="empty">未填写</span>
</p>
</view>
</view>
</template>
</uni-list-item>
</uni-list>
</z-paging>
</view>
</template>
<script setup>
import { ref, toRefs } from 'vue';
import { onShow } from "@dcloudio/uni-app";
import { getWarehousingInfo } from '../../api/system';
import getRepository from "@/api/getRepository";
import { objectToQuery } from '../until';
const props = defineProps({
// 是否为仓库查询
isWarehousing: {
type: Boolean,
default: true,
required: true
},
// 返回出库开单/入库开单
backStr: {
type: String,
default: true,
required: true
},
pathParams: {
type: Object,
default: null,
required: false
}
})
const { isWarehousing, backStr, pathParams } = toRefs(props)
// 数据:查询关键字
const queryParams = ref({
keyword: ''
})
// 绑定:加载屏
const pagingRef = ref(null)
// 数据:仓库/存储区
const infoList = ref([])
// 列表判断:获取仓库列表/存储库列表
const getList = () => {
if (isWarehousing.value) {
// 仓库列表
getWarehousing()
} else {
// 存储库列表
getRepositoryInfo()
}
}
// 列表:仓库列表
const getWarehousing = () => {
const userInfo = uni.getStorageSync('app_user')
const params = {
userId: `${userInfo.userId}`,
keyword: queryParams.value.keyword
}
getWarehousingInfo(params).then(res => {
res.data.forEach(e => {
e.showMore = false;
});
pagingRef.value.complete(res.data)
}).catch(res => {
pagingRef.value.complete(false)
})
}
// 列表:存储区列表
const getRepositoryInfo = async () => {
getRepository({ pageNum: 1, pageSize: 10 }).then(res => {
res.data.forEach(e => {
e.showMore = false;
});
pagingRef.value.complete(res.data)
}).catch(res => {
pagingRef.value.complete(false)
})
}
// 返回路径
const toBack = (back) => {
let url = ''
switch (back) {
case 'stockIn':
// 入库单开单
url = '/pages/warehousing/stockIn/create'
break;
case 'stockOut':
// 出库单开单
url = ''
break;
}
let params = pathParams.value
delete params.backStr
delete params.flag
const query = objectToQuery(params)
uni.navigateTo({
url: `${url}${query}`
})
}
// 选择:仓库/存储区
const onChecked = (val) => {
const flag = isWarehousing.value ? 'app_warehousing' : 'app_storageArea'
let infoChecked = uni.getStorageSync(flag);
if (!Array.isArray(infoChecked)) {
infoChecked = [];
}
if (val) {
infoChecked = [{ ...val }]
uni.setStorageSync(flag, infoChecked);
}
// 返回list
toBack(backStr.value)
}
onShow(() => {
pagingRef.value?.reload?.()
})
</script>
<style scoped lang="scss">
.topSearch {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 999;
padding: 4rpx;
background-color: #fff;
border-bottom: 1px solid #eee;
box-sizing: border-box;
}
.containerBox {
padding-top: 44px;
width: 100%;
height: 100%;
box-sizing: border-box;
.zp-l-text-rpx {
font-size: 12px;
}
}
::v-deep.listBox {
.uni-list {
background-color: #F8F8FF;
}
.uni-list-item {
margin-bottom: 1rpx;
}
.uni-list-item__container {
padding: 0;
}
.line {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #eee;
padding: 12rpx;
}
.title {
font-weight: 600;
font-size: 14px;
}
.content {
font-weight: 500;
font-size: 13px;
}
.empty {
color: #D3D3D3;
}
}
</style>

View File

@@ -0,0 +1,88 @@
<template>
<view>
<view>
<view class="detailInfo mb-2">
<view class="line title">
<p> {{ typeName + '单号' }}{{ detailInfo?.billNo }}</p>
<span :style="getColor(detailInfo?.billType)">
{{ getBillType(detailInfo?.billType,detailInfo?.status) }}
</span>
</view>
<p class="line content">仓库
<span> {{ detailInfo?.warehouseName }}</span>
</p>
<p class="line content">存储区
<span> {{ detailInfo?.areaName }}</span>
</p>
<p class="line content">开单时间
<span>{{ formatDate(detailInfo?.createTime) }}</span>
</p>
<p class="line content" v-if="detailInfo?.inboundTime">{{ typeName + '时间' }}
<span>{{ formatDate(detailInfo?.inboundTime) }}</span>
</p>
</view>
<view class="detailInfo mb-6">
<p class="line content">
<span class="grey" style="font-weight: 600;">详细备注</span>
<span>{{ detailInfo?.billRemark || '-' }}</span>
</p>
</view>
</view>
<!-- 物料列表 -只读 -->
<view>
<material-list ref="materialRef" isEdit="3" :extendData="{ billType: detailInfo?.billType }"
:pathParams="{ billNo: detailInfo?.billNo }" backStr="stockInDetail"
:formData="{ material: detailInfo.itemList }" />
</view>
</view>
</template>
<script setup>
import { getBillType, formatDate, getColor } from '../until'
import { computed, toRefs } from 'vue';
import MaterialList from './MaterialList.vue'
const props = defineProps({
// 查询列表类型 stockIn:入库 stockOut出库
type: {
type: String,
default: '',
required: true
},
detailInfo: {
type: Object,
default: {},
required: true
}
})
const { type, detailInfo } = toRefs(props)
const typeName = computed(() => type.value == 'stockIn' ? '入库单' : '出库单')
console.log(detailInfo, 'detailInfo');
</script>
<style scoped lang="scss">
.line {
display: flex;
background-color: #fff;
align-items: center;
padding: 6rpx 20rpx;
}
.title {
display: flex;
justify-content: space-between;
font-weight: 600;
font-size: 13px;
}
.content {
font-weight: 500;
font-size: 13px;
}
</style>

View File

@@ -0,0 +1,97 @@
<template>
<view class="step-container">
<view class="step-item" :class="{ done: index < current, active: index == current }"
v-for="(item, index) in stepList" :key="index">
<!-- 节点圆圈 -->
<view class="step-circle">{{ index + 1 }}</view>
<!-- 文字 -->
<view class="step-text">{{ item }}</view>
<!-- 连接线最后一个不显示 -->
<view class="step-line" v-if="index !== stepList.length - 1"></view>
</view>
</view>
</template>
<script setup>
import { ref } from 'vue'
// 步骤列表
const stepList = ref(['创建', '审核', '绑定', '完成'])
// 当前进度0开始
const current = ref(2)
</script>
<style scoped>
/* 整体容器 */
.step-container {
display: flex;
padding: 30rpx;
background: #fff;
border-radius: 16rpx;
}
/* 单个步骤 */
.step-item {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
}
/* 节点圆圈 */
.step-circle {
width: 40rpx;
height: 40rpx;
border-radius: 50%;
background: #cdd4e0;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-size: 24rpx;
z-index: 10;
}
/* 文字 */
.step-text {
margin-top: 12rpx;
font-size: 24rpx;
color: #999;
}
/* 连接线 */
.step-line {
position: absolute;
top: 20rpx;
left: 50%;
width: 100%;
height: 4rpx;
background: #cdd4e0;
z-index: 1;
}
/* ============= 状态样式 ============= */
/* 已完成 */
.step-item.done .step-circle {
background: #07c160;
}
.step-item.done .step-line {
background: #07c160;
}
.step-item.done .step-text {
color: #07c160;
}
/* 当前激活 */
.step-item.active .step-circle {
background: #465bfd;
}
.step-item.active .step-text {
color: #465bfd;
font-weight: bold;
}
</style>

View File

@@ -0,0 +1,281 @@
<template>
<!-- 物料列表 - 添加物料 -->
<view class="materialList">
<view class="remarkLine">
<text>物料列表</text>
<uv-button type="primary" v-if="isEdit == 1" :plain="true" size="small" text="添加物料"
@click="toMaterial"></uv-button>
<view v-if="isEdit == 5" class="flex align-center justify-between">
<span class="f-12 mr-16 grey" style="font-size: 12px;" v-if="num > 0">
剩余<span style="color: red;">
{{ num }}
</span>种物料未生成唯一码
</span>
<uv-button type="primary" :plain="true" size="small" text="快速生成唯一码"
@click="toGenerateUniqueCodeQuickly"></uv-button>
</view>
<!-- <p class="btn-link" v-if="isEdit == 2" @click="toEdit">修改</p> -->
</view>
<!-- 物料列表-->
<view class="material-list-container">
<uni-forms ref="materialFormRef" :modelValue="formData">
<view v-for="(item, idx) in formData.material" :key="item.id || idx" class="material-box"
@longpress="() => handleItemLongPress(item, index)">
<view class="material-item" v-if="`${item?.isDelete}` === '0'">
<!-- 标题 -->
<view class="title mb-2">
{{ item.materialName }} ({{ item.materialCode }})
</view>
<!-- 副标题简称/型号/规格/类型 -->
<view class="subTitle mb-2">
<span v-if="item.materialShortName">{{ item.materialShortName }} / </span>
<span v-if="item.model">{{ item.model }} / </span>
<span v-if="item.specification">{{ item.specification }} / </span>
<span v-if="item.typeName">{{ item.typeName }}</span>
</view>
<!-- uniqueCode -->
<view class="uniqueCode mb-2">
<span class="f-12 " v-if="item.uniqueCode">唯一码{{ item?.uniqueCode }}</span>
</view>
<!-- 数量 + 单位 -->
<view class="tag-row mb-2">
<span class="tag-error">{{ getTypeParentNames(item.typeParentNames) }}</span>
<view class="quantity-form">
<uni-forms-item :name="`material[${idx}].quantity`" label-width="0">
<uni-easyinput :disabled="!edit || isEdit == '5'"
v-model="formData.material[idx].quantity" type="number" :clearable="false"
placeholder="数量" />
</uni-forms-item>
<text class="unit">{{ item.unitName }}</text>
</view>
</view>
<!-- 库存状态 -->
<view class="flex justify-between mb-2 " v-if="isEdit == 3">
<p style="font-size: 13px;">
已入库
<span style="color:green">{{ getStockQuantity(item, 'complete') }}</span>
</p>
<p style="font-size: 13px;">
剩余
<span style="color:red">{{ getStockQuantity(item, 'remaining') }}</span>
</p>
</view>
<!-- 备注 -->
<view class="remark-row">
<uni-forms-item :name="`material[${idx}].remark`" label="备注:">
<uni-easyinput :disabled="!edit" v-model="formData.material[idx].remark" type="text"
:clearable="false" :inputBorder="false" placeholder="请填写备注信息" />
</uni-forms-item>
</view>
</view>
</view>
<!-- 空数据提示 -->
<view class="empty" v-if="!formData.material?.length">
暂无物料请添加物料
</view>
</uni-forms>
</view>
<!-- 选择物料 -->
<uv-modal ref="modalRef" class="chooseModal" :title="none" :showConfirmButton="false" :showCancelButton="false">
<p class="title">请选择称重来源</p>
<p class="link" @click="toMaterialSelection('0')">无线液位计</p>
<p class="link" @click="toMaterialSelection('1')">手动输入</p>
</uv-modal>
<!-- 删除弹窗 -->
<view>
<uni-popup ref="alertDialog" type="center">
<uni-popup-dialog type="error" v-if="isDialog" cancelText="取消" confirmText="确认" title="是否需要删除该唯一码?"
@confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
</uni-popup>
</view>
</view>
</template>
<script setup>
import { computed, onMounted, ref, toRefs } from 'vue';
import { assign, findIndex } from 'lodash';
import { getStockQuantity, objectToQuery } from '../until';
import { getTypeParentNames } from '../warehousing/uniqueCode/until';
import { onLoad, onShow } from "@dcloudio/uni-app";
const props = defineProps({
formData: { type: Object, default: () => ({ material: [], remark: '' }), required: true },//物料信息
isEdit: { type: Boolean, default: true, required: true }, //编辑1 / 物料只读2 / 入库单只读3 /入库生成唯一码编辑4 /5数量不可编辑 备注可编辑
backStr: { type: String, default: '' }, //选择物料返回页面的标识
pathParams: { type: Object, default: {} }, //只读时传入对应的code、id
extendData: { type: Object, default: {} }, //其他额外参数
})
const { formData, isEdit, backStr, pathParams, extendData } = toRefs(props)
console.log(extendData, 'extendData==>');
//是否为编辑状态
const edit = computed(() => {
if (`${isEdit.value}` === '1') return '1';
else if (`${isEdit.value}` === '4') return '4';
else return false;
})
// 删除:数据
const delItem = ref(null)
// 删除:开关
const alertDialog = ref(null)
// 删除:开关
const isDialog = ref(false)
const selectMaterialList = computed(() => extendData.value?.selectMaterialList)
const num = computed(() => selectMaterialList.value?.length || 0)
// 弹窗开关:入库单开单
const modalRef = ref()
// 按钮:添加物料
const toMaterial = () => {
if (backStr.value == 'stockIn') { // 入库单开单 - 添加物料可选择手输入/无线液位计
modalRef.value.open()
} else {
const path = objectToQuery({ ...pathParams.value, back: backStr?.value })
// 唯一码 - 编辑/新增
let url = '/pages/warehousing/uniqueCode/issueUniqueCode/materialSelection';
const value = uni.getStorageSync('app_material');
uni.setStorageSync('app_material', [{ ...value[0], uniqueCodeRemark: formData.value?.remark }]); // 将最新的唯一码备注写入缓存
uni.navigateTo({
url: `${url}${path}`
})
}
}
// 添加物料弹窗: 入库单入库 时可选择手动/无线液
const toMaterialSelection = (type) => {
// 0无线液 1手动输入
let url = ''
const path = objectToQuery({ ...pathParams.value, back: backStr.value })
if (type === '1') {
url = '/pages/warehousing/uniqueCode/issueUniqueCode/materialSelection'
}
uni.navigateTo({
url: `${url}${path}`
})
}
// 快速生成唯一码 -
const toGenerateUniqueCodeQuickly = () => {
const path = objectToQuery({ ...pathParams.value, back: 'inbound' })
uni.navigateTo({
url: `/pages/warehousing/uniqueCode/issueUniqueCode/index${path}`
})
}
// 删除弹窗:显示 长按事件
const handleItemLongPress = (val) => {
alertDialog.value.open()
isDialog.value = true
delItem.value = val
}
// 删除弹窗:关闭
const dialogClose = () => {
alertDialog.value.close()
isDialog.value = false
}
// 删除弹窗:确认
const dialogConfirm = () => {
const idx = findIndex(formData.value.material, (i) => `${i.id}` === `${delItem.value.id}`)
assign(formData.value.material[idx], { isDelete: '1' });
uni.setStorageSync('app_material', formData.value.material)
}
const getMaterialList = () => {
const params = formData.value?.material?.map((i) => ({
...i,
material: {
//? 这里的判断是为了区分 =详情带出的物料以及新增的物料 详情带出的物料有id以及materialId 新增物料id为物料id materialId无值
materialId: i.materialId ? i.materialId : i.id,
id: i.materialId ? i.id : null,
remark: i.remark,
quantity: i.quantity,
unitId: i.unitId,
isDelete: i?.isDelete,
uniqueCode: i?.uniqueCode
},
}))
return params
}
defineExpose({
getMaterialList
})
</script>
<style scoped lang="scss">
.remarkLine {
display: flex;
align-items: center;
background-color: #fff;
justify-content: space-between;
padding: 12px 15px;
margin-bottom: 2rpx;
text {
font-weight: 700;
font-size: 13px;
}
.btn-link {
font-weight: 500;
color: #3c9cff;
}
span {
font-size: 14px;
}
p {
font-weight: 700;
font-size: 14px;
}
}
::v-deep .uv-button {
height: 30px;
// line-height: 60rpx;
font-size: 24rpx;
}
.material-item {
padding: 12px 15px;
}
.empty {
text-align: center;
padding: 60rpx 0;
color: #999;
font-size: 26rpx;
}
::v-deep.chooseModal {
.uv-modal__content {
display: block;
padding-top: 24rpx !important;
padding: 48rpx;
.title {
font-size: 16px;
margin: 16rpx 0;
}
.link {
color: #999;
margin-top: 24rpx;
font-size: 14px;
}
}
}
</style>

View File

@@ -0,0 +1,107 @@
<template>
<!-- 状态栏占位 -->
<view class="nav-placeholder" :style="{ height: navHeight + 'px' }"></view>
<view class="navbar" :style="{ paddingTop: statusBarHeight + 'px' }">
<view class="left" @click="goBack">
<uni-icons type="left" size="18" />
</view>
<!-- 中间标题 -->
<view class="title">{{ title }}</view>
<!-- 右侧父组件传入插槽 -->
<view class="right">
<slot name="right"></slot>
</view>
</view>
<view class="content">
</view>
</template>
<script setup>
import { ref, onMounted, toRefs } from 'vue'
import { onLoad, onShow } from '@dcloudio/uni-app';
const props = defineProps({
title: { type: String, default: '' },
backUrl: { type: String, default: '' },
})
const statusBarHeight = ref(0)
const navHeight = ref(0)
const back = ref('')
const { backUrl, title } = toRefs(props)
onMounted(() => {
const res = uni.getSystemInfoSync()
statusBarHeight.value = res.statusBarHeight
navHeight.value = res.statusBarHeight + 44
})
// 接收id 且修改标题
onLoad(() => {
const pages = getCurrentPages()
if (pages.length >= 2) {
const prevPage = pages?.[pages.length - 2]
back.value = backUrl.value ? backUrl.value : prevPage.route
console.log(back.value, prevPage, pages, ' back.value');
}
})
// 返回
const goBack = () => {
console.log(back.value, back.value);
if (back.value) {
uni.navigateTo({
url: `/${back.value}`,
});
} else {
uni.navigateBack()
}
}
</script>
<style scoped lang="scss">
.navbar {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 70px;
background: #fff;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20rpx;
box-sizing: border-box;
z-index: 999;
// margin-bottom: 8px;
}
.left {
display: flex;
align-items: center;
}
.back-txt {
margin-left: 6rpx;
}
.title {
font-size: 14px;
font-weight: bold;
}
.right {
min-width: 60rpx;
display: flex;
align-items: center;
justify-content: flex-end;
}
.nav-placeholder {
width: 100%;
}
</style>

View File

@@ -0,0 +1,186 @@
<!-- 查询列表 - 使用我的出库单/我的入库单 -->
<template>
<view class="content">
<view class="topSearch">
<uni-easyinput type="text" v-model="queryParams.keyword" prefixIcon="search" :inputBorder="false"
@iconClick="getList" placeholder="请输入搜索内容" />
</view>
<z-paging ref="pagingRef" class="containerBox" v-model="list" @query="getList">
<uni-list class="listBox">
<uni-list-item v-for="item in list" :key="item.id" clickable @click="onDetail(item)">
<template v-slot:body>
<view style="display: flex; flex-direction: column; width: 100%;">
<view class="line title">
<p> {{ typeName + '编号' }}:{{ item.billNo }}</p>
<span :style="getColor(item?.billType)">
{{ getBillType(item?.billType, item?.status) }}
</span>
</view>
<p class="line content">{{ typeName + '类型' }}
<span> {{ getOrderType(item.status) }}</span>
</p>
<p class="line content">库位
<span> {{ item.areaName }}</span>
</p>
<p class="line content">开单时间
<span>{{ item.createTime }}</span>
</p>
</view>
</template>
</uni-list-item>
</uni-list>
</z-paging>
</view>
</template>
<script setup>
import _, { includes } from 'lodash';
import { computed, toRefs, ref } from 'vue';
import { onShow } from "@dcloudio/uni-app";
import { stockList } from '../../api/stockIn';
import { getBillType, getColor } from '../until';
const props = defineProps({
// 查询列表类型 stockIn:入库 stockIn-putAway入库单入库 stockOut出库
type: {
type: String,
default: '',
required: true
},
// 查询条件
query: {
type: Object,
default: {},
required: true
},
})
const { type, query } = toRefs(props)
const pagingRef = ref(null)
// 数据:列表
const list = ref([])
const typeName = computed(() => includes(type.value, 'stockIn') ? '入库单' : '出库单')
const getOrderType = () => {
if (includes(type.value, 'stockIn')) {
return '入库单入库'
} else {
return '出库单出库'
}
}
// 数据:关键字
const queryParams = ref({
keyword: ''
})
onShow(() => {
pagingRef.value?.reload?.()
})
// 点击:查看详情
const onDetail = (val) => {
if (_.includes(type.value, 'stockIn')) {
// pages/stockIn/detail
uni.navigateTo({
url: `/pages/warehousing/stockIn/components/detail?billNo=${val.billNo}&type=${type.value}`,
});
}
}
// 数据:获取列表
const getList = (pageNo, pageSize) => {
queryParams.value.pageNum = pageNo
if (_.includes(type.value, 'stockIn')) {
stockList({ ...queryParams?.value, ...query?.value }).then(res => {
res.rows.forEach(e => {
e.showMore = false;
});
pagingRef.value.complete(res.rows)
}).catch(res => {
pagingRef.value.complete(false)
})
} else if (type.value == 'stockOut') {
}
}
</script>
<style scoped lang="scss">
.topSearch {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 999;
padding: 4rpx;
background-color: #fff;
border-bottom: 1px solid #eee;
box-sizing: border-box;
}
.containerBox {
padding-top: 44px;
width: 100%;
height: 100%;
box-sizing: border-box;
.zp-l-text-rpx {
font-size: 12px;
}
}
::v-deep .listBox {
width: 100%;
height: 100%;
box-sizing: border-box;
background-color: #F8F8FF;
.zp-l-text-rpx {
font-size: 12px;
}
.uni-list {
background-color: #F8F8FF;
}
.uni-list-item {
margin-bottom: 4rpx;
}
.uni-list-item__container {
padding: 0;
}
.line {
display: flex;
// justify-content: space-between;
align-items: center;
// border-bottom: 1px solid #eee;
padding: 12rpx 20rpx;
}
.title {
display: flex;
justify-content: space-between;
font-weight: 600;
font-size: 13px;
}
.content {
font-weight: 500;
font-size: 13px;
}
.empty {
color: #D3D3D3;
}
span {
color: #696969;
}
}
</style>

View File

@@ -0,0 +1,144 @@
<!-- 获取仓库数据 -->
<template>
<view class="content">
<uv-form ref="formRef" class="form" :model="formData" label-width="150rpx">
<!-- 仓库 -->
<uv-form-item label="仓库" prop="warehouse">
<u-cell @click="onClick('warehouse')">
<view slot="title" class="u-slot-title">
<text class="u-cell-text" v-if="formData?.warehousing?.[0]?.deptName">
{{ formData?.warehousing?.[0].deptName }}
</text>
<text class="placeholder" v-else> 请选择仓库</text>
<uni-icons type="right" size="10" />
</view>
</u-cell>
</uv-form-item>
<!-- 存储区 -->
<uv-form-item label="存储区" prop="storageArea">
<u-cell @click="onClick('storageArea')">
<view slot="title" class="u-slot-title">
<text class="u-cell-text" v-if="formData?.storageArea?.[0]?.deptName">
{{ formData?.storageArea?.[0].deptName }}
</text>
<text class="placeholder" v-else> 请选择存储区</text>
<uni-icons type="right" size="10" />
</view>
</u-cell>
</uv-form-item>
<!-- 备注 -->
<uv-form-item label="备注">
<uv-input v-model="formData.remark" placeholder="请输入备注" align="right" border="none" />
</uv-form-item>
</uv-form>
</view>
</template>
<script setup>
import { ref, toRefs } from 'vue';
import { objectToQuery } from '../until';
import { onShow } from "@dcloudio/uni-app";
const props = defineProps({
// 数据:仓库信息
warehouseInfo: {
type: Object,
default: null,
required: false
},
// 数据:路径参数
pathParams: {
type: Object,
default: null,
required: false
}
})
const { warehouseInfo, pathParams } = toRefs(props)
// 表单数据
const formData = ref({ remark: '', warehousing: '', storageArea: '' })
// 赋值:更新列表值
const setFormData = (d) => {
if (!d) return;
formData.value = d
}
// 渲染:更新列表值
onShow(() => {
setFormData(warehouseInfo.value)
})
// 点击事件:选择仓库/选择存储区
const onClick = (type) => {
uni.setStorageSync('app_billRemark', formData.value.remark)
let query = { ...pathParams.value, backStr: 'stockIn' }
if (type == 'warehouse') {
query = objectToQuery({ ...query, flag: 'warehousing' })
} else if (type == 'storageArea') {
query = objectToQuery({ ...query, flag: 'storageArea' })
}
uni.navigateTo({
url: `/pages/warehousing/toChooseList${query}`,
});
}
//暴露:向父组件暴露 - 暂时没用
defineExpose({
getWarehousingInfo: () => {
return { ...formData.value }
}
})
</script>
<style lang="scss" scoped>
::v-deep .form {
// background-color: #fff;
padding: 0 0 12rpx 0;
.uv-input__content {
.uv-input__content__field-wrapper__field {
text-align: right !important;
}
}
.uv-form-item__body {
background-color: #fff;
padding: 12rpx;
margin-bottom: 2rpx;
align-items: center;
}
.uv-form-item__body__left__content__label {
font-size: 14px;
}
.uv-line {
border-bottom: 0 !important;
}
.uv-form-item__body__right__content__slot {
justify-content: flex-end;
align-items: center;
}
.uv-cell__body {
padding: 0
}
.uni-icons {
display: block;
}
.u-slot-title {
display: flex;
align-items: center;
}
}
.placeholder {
color: rgb(192, 196, 204);
margin-right: 10rpx;
}
</style>