yangzifeng/hazardousWaste_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

唯一码发放页面完成

Browse Source
This commit is contained in:
zx
2026-03-20 09:45:13 +08:00
parent 100ea5a0d1
commit b648176e82
63 changed files with 11415 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

274
pages/uniqueCode/myUniqueCode/detail.vue Normal file
View File

@@ -0,0 +1,274 @@
<!-- 唯一码详情 -->
<template>
<uv-skeletons :loading="loading" :skeleton="skeleton">
<view class=" content">
<!-- 唯一码展示 -->
<uni-list>
<uni-list-item v-for="item in uniqueCodeList" :key="item.id" clickable class="material-card">
<template v-slot:body>
<p style="display: flex; flex-direction: column; width: 100%;">
<!-- 编码、状态行 -->
<view class="flex-center">
<p class="title">编号：{{ item.code }}</p>
<p class="status">{{ getStatusName(item.status) }}</p>
</view>
<!-- 内容行 -->
<view class="text ">
<p>RFID：
<span v-if="item.rfidCode">{{ item.remark }}</span>
<span v-else style="color: #999;">未绑定RFID</span>
</p>
<p>生成时间：
<span>{{ item?.createTime }}</span>
</p>
<!-- 备注行-->
<view class="flex-center qrCode">
<p>备注：
<span v-if="item.remark">{{ item.remark }}</span>
<span v-else style="color: #999;">未填写</span>
</p>
<uv-image src="../../../static/qrcode.png" width="40rpx" height="40rpx"
style="margin-top:10rpx" />
</view>
</view>
</p>
</template>
</uni-list-item>
</uni-list>
<!-- 物料列表 -->
<view class="remarkLine">
<p>物料列表</p>
<p class="btn-link" @click="toEdit">修改</p>
</view>
<view>
<uni-forms ref="materialFormRef" :modelValue="formData.material" class="form">
<view v-for="(item, idx) in materialList" :key="item.id" class="material-card"
style="padding: 24rpx; margin-bottom: 16rpx;">
<view style="display: flex; flex-direction: column; width: 100%;">
<!-- 标题行 -->
<view class="title">{{ item.materialName }} ({{ item.materialCode }})</view>
<!--小标题行 简称/型号/规格/类型 -->
<view class="subTitle">
<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>
<!-- 数量行 -->
<view class="tag">
<uni-tag :text="getTypeParentNames(item.typeParentNames) || ''" type="error" />
<p class="tag-form">
<uni-forms-item :name="`material.${idx}.quantity`">
<uni-easyinput v-model="formData.material[idx].quantity" :disabled="true"
type="number" :clearable="false" />
</uni-forms-item>
<span style=" margin-left: 8rpx; width: 16px;">{{ item.unitName }}</span>
</p>
</view>
<!-- 备注行 -->
<view class="remark">
<uni-forms-item :name="`material.${idx}.remark`" label="备注：">
<uni-easyinput type="text" v-model="formData.material[idx].remark" :disabled="true"
:clearable="false" :inputBorder="false" placeholder="请填写备注信息" />
</uni-forms-item>
</view>
</view>
</view>
</uni-forms>
</view>
<!-- 底部按钮 -->
<view class="bottom">
<uv-button type="primary" text="确定"></uv-button>
<uv-button type="success" text="确定"></uv-button>
</view>
</view>
</uv-skeletons>
</template>
<script setup>
import { ref } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app';
import { detailUniqueCode } from '@/api/uniqueCode'
import { getTypeParentNames, getStatusName ,getDetail} from '../until';
const formData = ref({
remark: '',
material: []
})
// 路径参数
const pathParams = ref('')
// 物料列表数组
const materialList = ref([])
// 唯一码数组
const uniqueCodeList = ref([])
// 骨架屏开关
const loading = ref(true)
// 骨架屏样式
const skeleton = [{
type: 'line',
num: 3,
gap: '20rpx',
style: ['width: 200rpx;marginBottom: 50rpx;marginTop:50rpx;padding:24rpx', 'height: 100rpx;', 'width: 500rpx;'],
}]
// 详情：唯一码
const getDetailInfo = () => {
detailUniqueCode({ id: pathParams.value.id }).then((res) => {
if (res.code == 200) {
// ! 写成数组原因 为了适应可多个物料生成唯一码
materialList.value = [{ ...res.data.material, ...getDetail(res.data.material.wornMaterial) }]
uniqueCodeList.value = [res.data]
formData.value.material = [{ ...res.data.material, ...getDetail(res.data.material.wornMaterial)}]
console.log(materialList);
} else {
materialList.value = []
uniqueCodeList.value = []
uni.showToast({ title: '暂无数据', icon: 'none' })
}
loading.value = false
})
}
// 修改：唯一码的物料信息
const toEdit = () => {
uni.setStorageSync('app_material', [{ ...materialList.value[0], uniqueCodeRemark: uniqueCodeList.value[0].remark }]);
uni.navigateTo({
url: `/pages/uniqueCode/issueUniqueCode/index?code=${pathParams.value.code}&id=${pathParams.value.id}&materialId=${materialList.value[0].id}`,
});
}
// 接收id 且修改标题
onLoad((options) => {
if (!options.id) {
loading.value = false
uni.showToast({ title: '参数错误,无唯一码ID', icon: 'none' })
return
}
pathParams.value = options
getDetailInfo()
})
onShow(() => {
uni.setNavigationBarTitle({ title: pathParams.value.code })
})
</script>
<style scoped lang="scss">
.remarkLine {
display: flex;
align-items: center;
background-color: #fff;
justify-content: space-between;
padding: 8rpx 24rpx;
margin-bottom: 4rpx;
min-height: 40rpx;
margin-top: 16rpx;
span {
font-size: 14px;
}
p {
font-weight: 700;
font-size: 14px;
}
.btn-link {
font-weight: 500;
color: #3c9cff;
}
}
::v-deep .form {
.title {
color: #424242;
}
.tag {
.uni-tag {
display: flex;
align-items: center;
height: calc(25px - 6px);
}
.tag-form {
display: flex;
align-items: center;
}
.uni-forms-item {
margin-bottom: 0;
align-items: center;
.uni-easyinput__content,
.uni-easyinput__content-input {
height: 25px;
width: 80px;
}
}
}
.remark {
.uni-forms-item {
margin-bottom: 0;
margin-top: 16rpx;
display: flex;
align-items: center;
.is-disabled {
background-color: #fff !important;
}
.uni-forms-item__label {
color: #212121;
height: 40rpx;
}
.uni-easyinput__content-input {
height: 40rpx;
.uni-input-wrapper {
text-align: right;
}
}
.uni-input-placeholder {
text-align: right;
font-size: 13px;
}
}
}
.uni-input-input {
color: #616161
}
}
// 底部按钮
.bottom {
position: fixed;
bottom: 0;
height: 60rpx;
font-size: 14px;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
.uv-button-wrapper {
width: 50%;
border-radius: 0;
}
}
</style>

143
pages/uniqueCode/myUniqueCode/index.vue Normal file
View File

@@ -0,0 +1,143 @@
<!-- 唯一码 -->
<template>
<view class="content">
<view class="topSearch">
<uni-easyinput type="text" v-model="queryParams.code" prefixIcon="search" :inputBorder="false"
@iconClick="getMaterialList" placeholder="请输入关键词搜索" />
</view>
<!-- 唯一码列表 -->
<z-paging ref="pagingRef" class="containerBox" v-model="uniqueCodeList" @query="getMaterialList">
<uni-list>
<uni-list-item v-for="item in uniqueCodeList" :key="item.id" clickable class="material-card"
@longpress="() => handleItemLongPress(item, index)" @click="toDetail(item)">
<template v-slot:body>
<p style="display: flex; flex-direction: column; width: 100%;">
<!-- 编码、状态行 -->
<view class="flex-center">
<p class="title">编号：{{ item.code }}</p>
<p class="status">{{ getStatusName(item.status) }}</p>
</view>
<!-- 内容行 -->
<view class="text ">
<p>RFID：
<span v-if="item.rfidCode">{{ item.remark }}</span>
<span v-else style="color: #999;">未绑定RFID</span>
</p>
<p>生成时间：
<span>{{ item?.createTime }}</span>
</p>
<!-- 备注行-->
<view class="flex-center qrCode">
<p>备注：
<span v-if="item.remark">{{ item.remark }}</span>
<span v-else style="color: #999;">未填写</span>
</p>
<uv-image src="../../../static/qrcode.png" width="40rpx" height="40rpx"
style="margin-top:10rpx" />
</view>
</view>
</p>
</template>
</uni-list-item>
</uni-list>
</z-paging>
<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 { ref } from 'vue';
import { getStatusName } from '../until';
import { onShow } from "@dcloudio/uni-app";
import { getUniqueCodeList, delUniqueCode } from '@/api/uniqueCode'
const queryParams = ref({
code:''
})
const pagingRef = ref(null)
// 删除的数据
const delItem = ref(null)
// 删除弹框相关
const alertDialog = ref(null)
const isDialog = ref(false)
// 唯一码列表
const uniqueCodeList = ref([])
// 列表：唯一码
const getMaterialList = () => {
getUniqueCodeList(queryParams.value).then(res => {
res.rows.forEach(e => {
e.showMore = false;
});
pagingRef.value.complete(res.rows)
}).catch(res => {
pagingRef.value.complete(false)
})
}
onShow(() => {
pagingRef.value?.reload?.()
})
// 详情：唯一码
const toDetail = (val) => {
uni.navigateTo({
url: `/pages/uniqueCode/myUniqueCode/detail?id=${val.id}&code=${val.code}`,
});
}
// 删除弹窗：显示 长按事件
const handleItemLongPress = (val) => {
alertDialog.value.open()
isDialog.value = true
delItem.value = val
}
//删除弹窗：关闭
const dialogClose = () => {
alertDialog.value.close()
isDialog.value = false
}
//删除弹窗：确认
const dialogConfirm = () => {
console.log(delItem.value.id, 'delItem.value.id');
delUniqueCode({ ids: [delItem.value.id] }).then(res => {
console.log(res, '11');
dialogClose()
})
}
</script>
<style scoped lang="scss">
.topSearch {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 999;
padding: 10px;
background-color: #fff;
border-bottom: 1px solid #eee;
box-sizing: border-box;
}
.containerBox {
// padding: 0 12rpx;
padding-top: 60px;
width: 100%;
height: 100%;
box-sizing: border-box;
.zp-l-text-rpx {
font-size: 12px;
}
}
</style>