java_project
/
logpm_page
4
1
Fork 0
Code Issues Pull Requests Activity
Browse Source

新增盘点明细

fix_bug_pro20231227
13208366016 1 year ago
parent
00658a6e58
commit
be2afbeba4
9 changed files with 876 additions and 524 deletions
Split View
  1. BIN
      public/img/bg/bs.png
  2. 19
      src/api/distribution/createTask.js
  3. 12
      src/router/views/index.js
  4. 2
      src/views/basic/pda/basicPda.vue
  5. 634
      src/views/basic/pda/basicPdaTT.vue
  6. 514
      src/views/basic/pda/basicPdaTTT.vue
  7. 20
      src/views/distribution/checkInventoryTask/createTask.vue
  8. 195
      src/views/distribution/checkInventoryTask/createTaskfrom.vue
  9. 4
      vite.config.js

BIN
public/img/bg/bs.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 102 B

19
src/api/distribution/createTask.js
Unescape View File

@ -54,4 +54,21 @@ export const postBatchDelete = params => {
method: 'post',
params,
});
};
};
// 查看详情
// export const $_AddInfo = data => {
// return request({
// url: '/api/logpm-basic/pda/submit',
// method: 'post',
// data,
// });
// };
export const $_taskQuestSelectStrip = params => {
return request({
url: '/api/logpm-warehouse/blade-taskQuest/taskQuest/SelectStrip',
method: 'get',
params,
});
};

12
src/router/views/index.js
Unescape View File

@ -979,6 +979,18 @@ export default [
},
],
},
{
path: '/distribution/checkInventoryTask/createTaskfrom',
component: Layout,
redirect: '/distribution/checkInventoryTask/createTaskfrom',
children: [
{
path: '/distribution/checkInventoryTask/createTaskfrom',
name: '盘点任务明细',
component: () => import('@/views/distribution/checkInventoryTask/createTaskfrom.vue'),
},
],
},
// {
// path: 'basicdata/goodsShelf/basicdataGoodsShelfView',
// component: Layout,

2
src/views/basic/pda/basicPda.vue
Unescape View File

@ -34,7 +34,7 @@
</template>
</avue-crud>
<!-- <basic-pdaform v-if="!edit" @returnpda="returnpda" :pdaformdata="pdaformdata" /> -->
<basic-pdaform v-if="!edit" @returnpda="returnpda" :pdaformdata="pdaformdata" />
</basic-container>
</template>

634
src/views/basic/pda/basicPdaTT.vue
Unescape View File

@ -0,0 +1,634 @@
<template>
<!-- 表格组件 -->
<div class="el-content-el" ref="TabHeight">
<!-- 顶部开始 -->
<div class="el-Cart-button">
<!-- 表格顶部左侧按钮 -->
<div class="el-Cart-button-left">
<el-button type="primary" @click="AddInfo"
><el-icon><Plus /></el-icon>新 增</el-button
>
<el-button @click="handleDelete"
><el-icon><Delete /></el-icon>删 除</el-button
>
<el-button @click="handleDelete"
><el-icon><Edit /></el-icon>查看维修记录</el-button
>
</div>
<!-- 表格顶部右侧按钮 -->
<div class="el-Cart-button-right">
<!-- 刷新按钮 -->
<button>
<el-icon color="#ccc"><Refresh /></el-icon>
</button>
<!-- 功能按钮 -->
<button>
<el-icon color="#ccc"><Operation /></el-icon>
</button>
<!-- 搜索按钮 -->
<button>
<el-icon color="#ccc"><Search /></el-icon>
</button>
</div>
</div>
<!-- 顶部结束 -->
<div class="el-Cart">
<!-- 表格列开始 -->
<el-table :data="data" border :height="TabHeight + 'px'" style="width: 100%">
<el-table-column type="selection" width="55" fixed="left" />
<el-table-column
type="index"
fixed="left"
width="50"
height="100"
label="#"
align="center"
/>
<el-table-column prop="name" label="产品名称" width="180" align="center " sortable />
<el-table-column prop="model" label="型号" width="180" align="center " />
<el-table-column prop="purchaseAmount" label="购买金额" width="180" align="center " />
<el-table-column prop="state" label="状态" width="180" align="center " />
<el-table-column
prop="currentUsageWarehouse"
label="当前使用仓"
width="180"
align="center "
/>
<el-table-column prop="user" label="使用人" width="180" align="center " />
<el-table-column
prop="deviceSerialNumber"
label="设备序列号S/N"
width="180"
align="center "
/>
<el-table-column prop="userPosition" label="使用人岗位" width="180" align="center " />
<el-table-column prop="isDeposit" label="是否收取押金" width="180" align="center " />
<el-table-column prop="deposit" label="押金金额(元)" width="180" align="center " />
<el-table-column prop="purchasingCompany" label="采购公司" width="180" align="center " />
<el-table-column label="商品图片" width="180" align="center">
<template #default="props">
<img :src="props.row.photo" class="el-Img" />
</template>
</el-table-column>
<el-table-column prop="buyingTime" label="购买时间" width="180" align="center " />
<el-table-column prop="notes" label="备注" width="180" align="center " />
<el-table-column
prop="warrantyPeriodEndTime"
label="保修截止时间"
width="180"
align="center "
/>
<el-table-column fixed="right" label="操作" width="280" align="center ">
<template #default>
<el-button link type="primary" icon="el-icon-delete" @click="handleDelete"
>删除</el-button
>
<el-button link type="primary" icon="el-icon-view" @click="handleEdit(row)"
>编辑</el-button
>
<el-button link type="primary" icon="el-icon-view" @click="handleview(row)"
>查看</el-button
>
</template>
</el-table-column>
</el-table>
<!-- 表格翻页功能 -->
<div class="demo-pagination-block">
<el-pagination
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="pageList"
:small="small"
:disabled="disabled"
:background="background"
layout="total, sizes, prev, pager, next, jumper"
:total="2"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</div>
<!-- 弹窗组件 -->
<div class="addlalog">
<el-dialog v-model="AddLalog" title="新增产品">
<el-form label-position="top" label-width="100px" :model="AddForm">
<el-form-item label="产品名称">
<el-input v-model="AddForm.name" placeholder="请输入产品名称" />
</el-form-item>
<el-form-item label="购买金额">
<el-input v-model="AddForm.purchaseAmount" placeholder="请输入购买金额" />
</el-form-item>
<el-form-item label="当前使用仓">
<el-input v-model="AddForm.currentUsageWarehouse" placeholder="请输入当前使用仓" />
</el-form-item>
<el-form-item label="设备序列号S/N">
<el-input v-model="AddForm.deviceSerialNumber" placeholder="请输入设备序列号" />
</el-form-item>
<el-form-item label="是否收取押金">
<el-select v-model="AddForm.isDeposit" class="m-2" placeholder="选择是否收取押金">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="采购公司">
<el-input v-model="AddForm.purchasingCompany" placeholder="请输入采购公司" />
</el-form-item>
<el-form-item label="保修截至时间">
<el-date-picker
v-model="AddForm.warrantyPeriodEndTime"
type="date"
placeholder="选择保修截至日期"
size="default"
format="YYYY/MM/DD"
value-format="YYYY-MM-DD"
/>
</el-form-item>
<el-form-item label="图片">
<!-- photo -->
<el-upload
ref="uploadRef"
class="upload-demo"
:action="doubledCount"
:on-success="ImgSuccess"
:before-upload="beforeAvatarUpload"
:headers="headers"
v-if="!img"
>
<template #trigger>
<div class="img-icon">
<el-button type="primary">点击上传图片</el-button>
<el-icon><UploadFilled /></el-icon>
</div>
</template>
</el-upload>
<div class="el-load-img" v-else>
<div class="el-img">
<div class="el-img-left">
<el-icon><Link /></el-icon>
<span>{{ ImgText }}</span>
</div>
</div>
<div class="el-z">
<el-image
:src="url"
:zoom-rate="1.2"
:max-scale="7"
:min-scale="0.2"
:preview-src-list="UrlImg"
:initial-index="4"
:z-index="10"
fit="cover"
/>
</div>
<el-icon><SuccessFilled /></el-icon>
</div>
</el-form-item>
<el-form-item label="型号">
<el-input v-model="AddForm.model" placeholder="请输入型号" />
</el-form-item>
<el-form-item label="状态">
<el-select v-model="AddForm.state" class="m-2" placeholder="选择状态">
<el-option
v-for="item in options2"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="使用人">
<el-input v-model="AddForm.user" placeholder="请输入使用人" />
</el-form-item>
<el-form-item label="使用人岗位">
<el-input v-model="AddForm.userPosition" placeholder="请输入使用人岗位" />
</el-form-item>
<el-form-item label="押金金额(RMB)">
<el-input v-model="AddForm.deposit" placeholder="请输入押金金额(元)" />
</el-form-item>
<el-form-item label="购买时间">
<el-date-picker
v-model="AddForm.buyingTime"
type="date"
placeholder="选择购买日期"
size="default"
format="YYYY/MM/DD"
value-format="YYYY-MM-DD"
/>
</el-form-item>
<el-form-item label="备注">
<el-input v-model="AddForm.notes" placeholder="请输入备注" />
</el-form-item>
</el-form>
<!-- 弹窗底部提交按钮 -->
<div class="el-dialog-button">
<el-button type="danger" @click="submit">
<el-icon><Select /></el-icon>
确认提交
</el-button>
</div>
</el-dialog>
</div>
<!-- 弹窗结束 -->
</div>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted, computed } from 'vue';
import { getList, getDetail, $_AddInfo, update, remove, $_TableList } from '@/api/basic/basicPda'; //API
import { ElMessage, type UploadProps } from 'element-plus';
import { getToken } from '@/utils/auth';
const currentPage = ref(1); // 默认页码
const pageSize = ref(30); // 默认每一页几条
const pageList = ref([5, 10, 50, 100, 200]); // 选择每页显示多少条
const small = ref(false);
const background = ref(true); // 是否开启背景颜色
const disabled = ref(false); // 是否禁止使用页码功能
const data = ref([]); // 表单数据
const TabHeight = ref(); //动态获取表格高度
const AddLalog = ref(false); //提交弹窗
const img = ref(false); //图片是否上传成功
const ImgText = ref(''); //图片上传成功文件名
const AddForm = ref({
//表单信息
});
const value1 = ref(''); //日期
const optionsvalue = ref(''); //下拉框值
const optionsvalue2 = ref(''); //状态值
const uploadRef = ref(); //图片上传
const options = [
//下拉选择框
{
value: '0',
label: '是',
},
{
value: '1',
label: '否',
},
];
const options2 = [
//下拉选择框
{
value: '1',
label: '正常',
},
{
value: '2',
label: '维修',
},
{
value: '3',
label: '不能使用(不能开机)',
},
];
// 图片上传背景图，固定白色背景
const url =
'https://img1.baidu.com/it/u=1996827238,2183445322&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=889';
// 图片预览显示
const UrlImg = ref([]);
// 图片上传接口
const doubledCount = computed(() => {
return '/api/blade-resource/oss/endpoint/put-file';
});
// 图片上传必须携带TOKEN
const headers = computed(() => {
return { 'Blade-Auth': 'Bearer ' + getToken() };
});
// 获取表格数据
function onLoad() {
// 获取表格数据API（$_TableList）
$_TableList({ current: currentPage.value, size: pageSize.value }).then(res => {
console.log(res.data.data.records);
//表格信息
data.value = res.data.data.records;
});
}
// 动态获取DOM高度给表单防止页面出现滚动条
onMounted(() => {
//默认值88
TabHeight.value = TabHeight.value.offsetHeight - 91;
// 等待DOM高度被复制之后在请求数据，防止被数据撑开高度
onLoad();
});
// 新增数据功能
const AddInfo = () => {
console.log(111);
AddLalog.value = true;
};
// 图片上传
const imageUrl = ref('');
// 图片上传成功回调函数
const ImgSuccess: UploadProps['onSuccess'] = (response, uploadFile) => {
console.log(response, uploadFile, '123123123123123122312123');
console.log(response.data.link);
if (response.success === true) {
img.value = true;
// 图片放入预览
UrlImg.value.push(response.data.link);
console.log(UrlImg.value);
// 图片存入表单准备提交
AddForm.value.photo = response.data.link;
console.log(img.value);
// 显示图片名字
ImgText.value = response.data.originalName;
}
};
// 上传图片规则
const beforeAvatarUpload: UploadProps['beforeUpload'] = rawFile => {
if (rawFile.type !== 'image/png') {
ElMessage.error('图片格式只能为image/png!');
return false;
} else if (rawFile.size / 1024 / 1024 > 2) {
ElMessage.error('图片大小不能大于2MB!');
return false;
}
return true;
};
// 表单信息提交
const submit = () => {
console.log(AddForm.value);
$_AddInfo(AddForm.value).then(res => {
console.log(res);
});
};
</script>
<style scoped lang="scss">
// 最外层 IDV
.el-content-el {
padding: 0 8px;
padding-top: 8px;
background-color: #fff;
height: 100%;
box-sizing: border-box;
// 表格顶部按钮
:deep(.el-Cart-button) {
margin-bottom: 8px;
display: flex;
justify-content: space-between;
}
// 表格顶部左侧、右侧按钮样式
.el-Cart-button-left,
.el-Cart-button-right {
display: flex;
margin: 0 0px;
justify-content: space-between;
}
.el-Cart-button-left {
:deep(button) {
padding: 0 14px;
min-width: 70px;
display: flex;
span {
width: 100%;
display: inline-flex;
align-items: center;
justify-content: space-between;
i {
margin-right: 6px;
}
}
}
}
.el-Cart-button-right {
display: flex;
margin: 0 0px;
justify-content: space-between;
align-items: center;
button {
background-color: transparent;
border-radius: 50%;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #ccc;
margin-right: 8px;
&:hover {
background-color: #172e601f;
i {
color: #0e2549;
}
}
// 去掉最后一个按钮右侧边距
&:last-child {
margin-right: 0;
}
}
}
.el-Cart {
// 表格标题颜色
:deep(.el-table__header) {
th {
background-color: #fafafa;
color: #000;
}
}
// 组件样式开始
// 分页样式
.demo-pagination-block {
display: flex;
justify-content: flex-end;
margin-top: 6px;
}
// 表格行高度
:deep(.el-table__row) {
height: 60px;
}
// 表格图片
.el-Img {
width: 100%;
height: 40px;
img {
width: 100%;
height: 100%;
}
}
}
// 新增数据弹窗组件样式
:deep(.addlalog) {
// 弹窗
.el-dialog__header {
border-bottom: 1px solid #172e607d;
margin-right: 0;
margin-bottom: 0;
padding-bottom: 20px;
position: relative;
i {
color: #172e60;
border-radius: 50%;
border: 1px solid;
transition: transform 1s;
}
}
.el-dialog__header button:hover {
i {
transform: rotate(360deg);
}
}
// 弹窗标题左侧小竖线
.el-dialog__header::after {
content: '';
display: block;
width: 3px;
height: 16px;
background-color: #172e60;
position: absolute;
left: 8px;
top: 24px;
}
.el-dialog__body {
.el-form {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.el-form-item {
width: 276px;
.el-form-item__label {
font-family: '黑体';
}
}
/* 去掉第三个、第六个、第九个div的右外边距 */
.el-form-item:nth-child(3n) {
margin-right: 0;
}
}
.el-form-item__content {
height: 30px;
// 日期选择框
.el-input {
width: 100%;
height: 30px !important;
}
// 下拉选择框
.el-select {
width: 100%;
}
}
}
// 底部提交
:deep(.el-dialog-button) {
display: flex;
justify-content: flex-end;
}
.el-dialog-button button:hover {
color: #fff;
background-color: #10d070;
transition: all 0.3s ease-in-out; /* 添加动画效果 */
background-color: #10d070;
border: 1px solid #10d070;
}
// 图片上传
.img-icon {
width: 100%;
position: relative;
.el-button {
width: 100%;
background-color: #fff;
color: #a8abb9;
justify-content: flex-start;
border: 1px solid #dcdfe6;
}
i {
position: absolute;
left: 110px;
top: 8px;
font-size: 18px;
}
}
:deep(.el-load-img) {
width: 100%;
height: 32px;
display: flex;
align-items: center;
justify-content: space-between;
.el-image {
width: 100%;
height: auto;
img {
width: 100%;
}
}
.el-image-viewer__canvas {
img {
width: 50%;
height: 50%;
z-index: 10;
}
}
.el-z {
.el-image {
position: absolute;
height: 28px;
top: 2px;
left: 1px;
}
}
.el-icon {
color: #10d070;
}
}
:deep(.upload-demo) {
width: 100%;
.el-upload {
width: 100%;
}
ul {
margin-top: 0;
}
}
// 图片上传成功
.el-img {
border: 1px solid #ccc;
width: 100%;
border-radius: 4px;
display: flex;
align-items: center;
justify-content: space-between;
height: 30px;
position: absolute;
top: 0;
left: 0;
.el-img-left {
display: flex;
align-items: center;
span {
z-index: 9;
}
i {
margin-right: 8px;
color: #10d070;
z-index: 9;
}
}
i {
color: #10d070;
margin-left: 6px;
}
}
}
</style>

514
src/views/basic/pda/basicPdaTTT.vue
Unescape View File

@ -1,514 +0,0 @@
<template>
<!-- 表格组件 -->
<div class='el-content-el' ref='TabHeight'>
<!-- 顶部开始 -->
<div class="el-Cart-button">
<!-- 表格顶部左侧按钮 -->
<div class="el-Cart-button-left">
<el-button type="primary" @click="AddInfo"><el-icon><Plus /></el-icon>新 增</el-button>
<el-button @click="handleDelete"><el-icon><Delete /></el-icon>删 除</el-button>
<el-button @click="handleDelete"><el-icon><Edit /></el-icon>查看维修记录</el-button>
</div>
<!-- 表格顶部右侧按钮 -->
<div class="el-Cart-button-right">
<!-- 刷新按钮 -->
<button>
<el-icon color="#ccc"><Refresh /></el-icon>
</button>
<!-- 功能按钮 -->
<button>
<el-icon color="#ccc"><Operation /></el-icon>
</button>
<!-- 搜索按钮 -->
<button>
<el-icon color="#ccc"><Search /></el-icon>
</button>
</div>
</div>
<!-- 顶部结束 -->
<div class='el-Cart'>
<!-- 表格列开始 -->
<el-table :data="data" border :height="TabHeight+'px'" style="width: 100%;">
<el-table-column type="selection" width="55" fixed="left"/>
<el-table-column type="index" fixed="left" width="50" height="100" label="#" align="center"/>
<el-table-column prop="name" label="产品名称" width="180" align="center " sortable/>
<el-table-column prop="model" label="型号" width="180" align="center " />
<el-table-column prop="purchaseAmount" label="购买金额" width="180" align="center "/>
<el-table-column prop="state" label="状态" width="180" align="center "/>
<el-table-column prop="currentUsageWarehouse" label="当前使用仓" width="180" align="center "/>
<el-table-column prop="user" label="使用人" width="180" align="center " />
<el-table-column prop="deviceSerialNumber" label="设备序列号S/N" width="180" align="center "/>
<el-table-column prop="userPosition" label="使用人岗位" width="180" align="center "/>
<el-table-column prop="isDeposit" label="是否收取押金" width="180" align="center "/>
<el-table-column prop="deposit" label="押金金额(元)" width="180" align="center "/>
<el-table-column prop="purchasingCompany" label="采购公司" width="180" align="center "/>
<el-table-column label="商品图片" width="180" align="center" >
<template #default="props">
<img :src="props.row.photo" class='el-Img'>
</template>
</el-table-column>
<el-table-column prop="buyingTime" label="购买时间" width="180" align="center "/>
<el-table-column prop="notes" label="备注" width="180" align="center "/>
<el-table-column prop="warrantyPeriodEndTime" label="保修截止时间" width="180" align="center "/>
<el-table-column fixed="right" label="操作" width="280" align="center ">
<template #default>
<el-button link type="primary" icon="el-icon-delete" @click="handleDelete">删除</el-button>
<el-button link type="primary" icon="el-icon-view" @click="handleEdit(row)">编辑</el-button>
<el-button link type="primary" icon="el-icon-view" @click="handleview(row)">查看</el-button>
</template>
</el-table-column>
</el-table>
<!-- 表格翻页功能 -->
<div class="demo-pagination-block">
<el-pagination
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="pageList"
:small="small"
:disabled="disabled"
:background="background"
layout="total, sizes, prev, pager, next, jumper"
:total="2"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</div>
<!-- 弹窗组件 -->
<div class='addlalog'>
<el-dialog v-model="AddLalog" title="新增产品" >
<el-form label-position="top" label-width="100px" :model="AddForm">
<el-form-item label="产品名称">
<el-input v-model="AddForm.name" placeholder="请输入产品名称"/>
</el-form-item>
<el-form-item label="购买金额">
<el-input v-model="AddForm.purchaseAmount" placeholder="请输入购买金额"/>
</el-form-item>
<el-form-item label="当前使用仓">
<el-input v-model="AddForm.currentUsageWarehouse" placeholder="请输入当前使用仓"/>
</el-form-item>
<el-form-item label="设备序列号S/N">
<el-input v-model="AddForm.deviceSerialNumber" placeholder="请输入设备序列号" />
</el-form-item>
<el-form-item label="是否收取押金">
<el-select v-model="AddForm.isDeposit" class="m-2" placeholder="选择是否收取押金">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="采购公司">
<el-input v-model="AddForm.purchasingCompany" placeholder="请输入采购公司"/>
</el-form-item>
<el-form-item label="保修截至时间">
<el-date-picker
v-model="AddForm.warrantyPeriodEndTime"
type="date"
placeholder="选择保修截至日期"
size="default"
format="YYYY/MM/DD"
/>
</el-form-item>
<el-form-item label="图片">
<!-- photo -->
<el-upload
ref="uploadRef"
class="upload-demo"
:action=doubledCount
:on-success="ImgSuccess"
:before-upload="beforeAvatarUpload"
:headers="headers"
v-if='!img'
>
<template #trigger >
<div class='img-icon'>
<el-button type="primary">点击上传图片</el-button>
<el-icon><UploadFilled /></el-icon>
</div>
</template>
</el-upload>
<div v-else class='el-img'>
<div class='el-img-left'>
<el-icon><Link /></el-icon>
<span>{{ImgText}}</span>
</div>
<el-icon><SuccessFilled /></el-icon>
</div>
</el-form-item>
<el-form-item label="型号">
<el-input v-model="AddForm.model" placeholder="请输入型号"/>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="AddForm.state" class="m-2" placeholder="选择状态">
<el-option
v-for="item in options2"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="使用人">
<el-input v-model="AddForm.user" placeholder="请输入使用人"/>
</el-form-item>
<el-form-item label="使用人岗位">
<el-input v-model="AddForm.userPosition" placeholder="请输入使用人岗位"/>
</el-form-item>
<el-form-item label="押金金额(RMB)">
<el-input v-model="AddForm.deposit" placeholder="请输入押金金额(元)" />
</el-form-item>
<el-form-item label="购买时间">
<el-date-picker
v-model="AddForm.buyingTime"
type="date"
placeholder="选择购买日期"
size="default"
format="YYYY/MM/DD"
/>
</el-form-item>
<el-form-item label="备注">
<el-input v-model="AddForm.notes" placeholder="请输入备注"/>
</el-form-item>
</el-form>
<!-- 弹窗底部提交按钮 -->
<div class='el-dialog-button'>
<el-button type="danger" @click="submit">
<el-icon><Select/></el-icon>
确认提交
</el-button>
</div>
</el-dialog>
</div>
<!-- 弹窗结束 -->
</div>
</template>
<script setup lang='ts'>
import { ref, reactive,onMounted,computed } from 'vue';
import { getList, getDetail, add, update, remove,$_TableList } from '@/api/basic/basicPda'; //API
import { ElMessage, type UploadProps } from 'element-plus'
import { getToken } from '@/utils/auth';
const currentPage = ref(1); // 默认页码
const pageSize = ref(30); // 默认每一页几条
const pageList = ref([5, 10, 50, 100, 200]); // 选择每页显示多少条
const small = ref(false);
const background = ref(true); // 是否开启背景颜色
const disabled = ref(false); // 是否禁止使用页码功能
const data = ref([]); // 表单数据
const TabHeight = ref();//动态获取表格高度
const AddLalog = ref(false)//提交弹窗
const img=ref(false);//图片是否上传成功
const ImgText=ref('')
const AddForm = ref({ //表单信息
})
const value1 = ref('') //日期
const optionsvalue = ref('')//下拉框值
const optionsvalue2=ref('')//状态值
const uploadRef = ref()//图片上传
const options = [//下拉选择框
{
value: '0',
label: '是',
},
{
value: '1',
label: '否',
},
]
const options2 = [//下拉选择框
{
value: '1',
label: '正常',
},
{
value: '2',
label: '维修',
},
{
value: '3',
label: '不能使用(不能开机)',
},
]
// 图片上传接口
const doubledCount = computed(() => {
return '/api/blade-resource/oss/endpoint/put-file'
})
// 图片上传写代码TOKEN
const headers =computed(()=>{
return {'Blade-Auth': 'Bearer ' + getToken(),
};
})
// 获取表格数据
function onLoad(){
// 获取表格数据API（$_TableList）
$_TableList({ current:currentPage.value, size: pageSize.value }).then(res=>{
console.log(res.data.data.records);
//表格信息
data.value=res.data.data.records
})
}
// 动态获取DOM高度给表单防止页面出现滚动条
onMounted(() => {
//默认值88
TabHeight.value = TabHeight.value.offsetHeight-91;
// 等待DOM高度被复制之后在请求数据，防止被数据撑开高度
onLoad()
})
// 新增数据功能
const AddInfo=()=>{
console.log(111);
AddLalog.value=true;
}
// 图片上传
const imageUrl = ref('')
// 图片上传成功回调函数
const ImgSuccess: UploadProps['onSuccess'] = (response,uploadFile) => {
console.log(response,uploadFile,'123123123123123122312123');
console.log('================================================================');
if(response.success===true){
img.value=true;
console.log(img.value);
ImgText.value = response.data.originalName
}
}
// 上传图片规则
const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
if (rawFile.type !== 'image/png') {
ElMessage.error('图片格式只能为image/png!')
return false
} else if (rawFile.size / 1024 / 1024 > 2) {
ElMessage.error('图片大小不能大于2MB!')
return false
}
return true
}
</script>
<style scoped lang='scss'>
// 最外层 IDV
.el-content-el {
padding: 0 8px;
padding-top:8px;
background-color: #fff;
height: 100%;
box-sizing: border-box;
// 表格顶部按钮
:deep(.el-Cart-button) {
margin-bottom: 8px;
display: flex;
justify-content: space-between;
}
// 表格顶部左侧、右侧按钮样式
.el-Cart-button-left,.el-Cart-button-right{
display: flex;
margin: 0 0px;
justify-content: space-between;
}
.el-Cart-button-left{
:deep( button){
padding: 0 14px;
min-width: 70px;
display: flex;
span{
width: 100%;
display: inline-flex;
align-items: center;
justify-content: space-between;
i{
margin-right: 6px;
}
}
}
}
.el-Cart-button-right {
display: flex;
margin: 0 0px;
justify-content: space-between;
align-items: center;
button {
background-color: transparent;
border-radius: 50%;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #ccc;
margin-right: 8px;
&:hover {
background-color: #172e601f;
i {
color: #0e2549;
}
}
// 去掉最后一个按钮右侧边距
&:last-child {
margin-right: 0;
}
}
}
.el-Cart {
// 表格标题颜色
:deep(.el-table__header) {
th {
background-color: #fafafa;
color: #000;
}
}
// 组件样式开始
// 分页样式
.demo-pagination-block {
display: flex;
justify-content: flex-end;
margin-top: 6px;
}
// 表格行高度
:deep(.el-table__row) {
height: 60px;
}
// 表格图片
.el-Img {
width: 100%;
height: 40px;
img {
width: 100%;
height: 100%;
}
}
}
// 新增数据弹窗组件样式
:deep(.addlalog){
// 弹窗
.el-dialog__header{
border-bottom: 1px solid #172e607d ;
margin-right:0;
margin-bottom:0;
padding-bottom:20px;
position: relative;
i{
color:#172e60;
}
}
// 弹窗标题左侧小竖线
.el-dialog__header::after{
content: "";
display: block;
width: 3px;
height: 16px;
background-color: #172e60;
position: absolute;
left: 8px;
top: 24px;
}
.el-dialog__body{
.el-form{
width: 100%;
display:flex;
flex-wrap: wrap;
justify-content: space-between;
}
.el-form-item{
width:276px;
}
/* 去掉第三个、第六个、第九个div的右外边距 */
.el-form-item:nth-child(3n) {
margin-right: 0;
}
}
.el-form-item__content{
height:30px;
// 日期选择框
.el-input{
width: 100%;
height:30px !important;
}
// 下拉选择框
.el-select{
width: 100%;
}
}
}
// 底部提交
.el-dialog-button{
display:flex;
justify-content: flex-end;
}
// 图片上传
.img-icon{
width: 100%;
position: relative;
.el-button{
width: 100%;
background-color: #fff;
color: #a8abb9;
justify-content: flex-start;
border: 1px solid #dcdfe6;
}
i{
position:absolute;
left: 110px;
top: 8px;
font-size:18px
}
}
:deep(.upload-demo){
width:100%;
.el-upload{
width:100%
}
ul{
margin-top:0;
}
}
// 图片上传成功
.el-img{
border: 1px solid #ccc;
width: 100%;
border-radius: 4px;
padding: 0 8px;
display: flex;
align-items: center;
justify-content: space-between;
height: 30px;
.el-img-left{
display:flex;
align-items:center;
i{
margin-right:8px;
color:#ccc;
}
}
i{
color: #10d070;
margin-left: 6px;
}
}
}
</style>

20
src/views/distribution/checkInventoryTask/createTask.vue
Unescape View File

@ -515,7 +515,7 @@ export default {
/**
* 批量删除
*/
handleBatchDelete() {
handleBatchDelete() {
if (this.selectionList.length === 0)
return this.$message({
type: 'error',
@ -531,7 +531,7 @@ export default {
.then(async () => {
return postBatchDelete({ ids });
})
.then((res) => {
.then(res => {
this.onLoad(this.page);
const { code, msg } = res.data;
if (code === 200) {
@ -541,9 +541,6 @@ export default {
});
}
});
},
btnsc(index, row) {
@ -750,7 +747,7 @@ export default {
type: 'warning',
})
.then(() => {
return postBatchDelete({ids: row.id});
return postBatchDelete({ ids: row.id });
})
.then(() => {
this.onLoad(this.page);
@ -767,7 +764,18 @@ export default {
handleViewCheck(row) {
// 开启查看模式
this.view = true;
console.log(this.view);
this.form = row;
console.log(row,'任务信息');
console.log(this.$router);
// this.$router.push('/distribution/checkInventoryTask/createTaskfrom')
this.$router.push({
path: '/distribution/checkInventoryTask/createTaskfrom',
query: {
id: row.id,
// 其他参数...
}
});
},
/**

195
src/views/distribution/checkInventoryTask/createTaskfrom.vue
Unescape View File

@ -0,0 +1,195 @@
<template>
<div class="el-content-el" ref="TabHeight">
<el-tabs type="border-card">
<el-tab-pane label="包条">
<el-table :data="BTtableData" :height="TabHeight + 'px'" style="width: 100%" border>
<el-table-column fixed prop="ordePackageCode" label="包条码" width="180" />
<el-table-column prop="orderCode" label="订单号" width="320" />
<el-table-column prop="orderCode" label="托盘码" width="320" />
<el-table-column prop="orderCode" label="一级品类" width="320" />
<el-table-column prop="orderCode" label="二级品类" width="320" />
<el-table-column prop="orderCode" label="三级品类" width="320" />
<el-table-column prop="orderCode" label="发站仓" width="320" />
<el-table-column prop="orderCode" label="品牌" width="320" />
<el-table-column prop="state" label="盘点状态" width="120">
<template #default="props">
<span>
{{
props.row.questStatus === 0
? '待盘点'
: props.row.questStatus === 1
? '已盘'
: props.row.questStatus === 2
? '未盘点'
: '已排除'
}}
</span>
</template>
</el-table-column>
<el-table-column prop="address" label="盘点方式" width="300">
<template #default="props">
<span>
{{
props.row.questStatus === 1
? '随机'
: props.row.questStatus === 2
? '库位'
: props.row.questStatus === 3
? '订单'
: '托盘'
}}
</span>
</template>
</el-table-column>
<el-table-column prop="serviceNumber" label="服务号" width="120">
<template #default="props">
<span>
{{ props.row.serviceNumber ? props.row.serviceNumber : '/' }}
</span>
</template>
</el-table-column>
<!-- <el-table-column fixed="right" label="操作" width="120">
<template #default>
<el-button link type="primary" size="small" @click="handleClick">Detail</el-button>
<el-button link type="primary" size="small">Edit</el-button>
</template>
</el-table-column> -->
<el-table-column prop="state" label="托盘码" width="220">
<template #default="props">
<span>
{{ props.row.trayCode ? props.row.trayCode : '/' }}
</span>
</template>
</el-table-column>
<el-table-column prop="state" label="服务号" width="120" />
<el-table-column prop="state" label="托盘码" width="120">
<template #default="props">
<span>
{{ props.row.trayCode ? props.row.trayCode : '/' }}
</span>
</template>
</el-table-column>
<el-table-column prop="state" label="托盘码" width="120">
<template #default="props">
<span>
{{ props.row.trayCode ? props.row.trayCode : '/' }}
</span>
</template>
</el-table-column>
<el-table-column prop="state" label="盘点时间" width="120">
<template #default="props">
<span>
{{ props.row.trayCode ? props.row.trayCode : '/' }}
</span>
</template>
</el-table-column>
</el-table>
<!-- 表格翻页功能 -->
<div class="demo-pagination-block">
<el-pagination
v-model:current-page="PageSize"
v-model:page-size="Page"
:page-sizes="pageList"
:small="small"
:disabled="disabled"
:background="background"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="BTSizeChange"
@current-change="BTCurrentChange"
/>
</div>
</el-tab-pane>
<el-tab-pane label="库存品">Config</el-tab-pane>
<el-tab-pane label="零担">Role</el-tab-pane>
</el-tabs>
</div>
</template>
<script lang="ts" setup>
import { $_taskQuestSelectStrip } from '@/api/distribution/createTask';
import { useRouter, useRoute } from 'vue-router';
import { ref } from 'vue';
const router = useRouter();
const route = useRoute();
const PageSize = ref(1); // 默认页码
const Page = ref(20); // 默认每一页几条
const pageList = ref([5, 10, 20, 50, 100]); // 选择每页显示多少条
const small = ref(false);
const background = ref(true); // 是否开启背景颜色
const disabled = ref(false); // 是否禁止使用页码功能
const total = ref(0); //总条数
const TabHeight = ref(); //动态获取表格高度
const BTtableData = ref([]); //包条信息
onMounted(() => {
//默认值88
TabHeight.value = TabHeight.value.offsetHeight - 127;
// 等待DOM高度被复制之后在请求数据，防止被数据撑开高度
onLoad();
});
const handleClick = () => {
console.log('click');
};
// 请求包条数据
function list() {
$_taskQuestSelectStrip({
id: route.query.id, //ID
current: PageSize.value, //页码
size: Page.value, //条数
}).then(res => {
console.log(
res.data.data.records,
'res================================================================'
);
console.log(res);
total.value = res.data.data.total;
BTtableData.value = res.data.data.records;
});
}
list(); //页码初始化请求数据包条
// 包条每页显示多少条
const BTSizeChange = val => {
Page.value = val;
list();
};
// 包条翻页
const BTCurrentChange = val => {
PageSize.value = val;
list();
};
</script>
<style scoped lang="scss">
.el-content-el {
padding: 0 8px;
padding-top: 8px;
background-color: #fff;
height: 100%;
box-sizing: border-box;
}
:deep(.el-table__header th) {
background-color: #fafafa !important;
color: #000;
}
.demo-pagination-block {
display: flex;
justify-content: flex-end;
margin-top: 15px;
}
:deep(.el-table__row) {
height: 30px;
}
:deep(.el-table__cell) {
.cell {
display: flex;
justify-content: center;
}
}
</style>

4
vite.config.js
Unescape View File

@ -16,13 +16,13 @@ export default ({ mode, command }) => {
// hy
// target: 'http://192.168.10.48:8888',
// lmy
// target: 'http://192.168.10.123:8889',
target: 'http://192.168.10.123:8889',
// caoge
// target: 'http://192.168.10.101:8888',
// cyz
// target: 'http://192.168.10.75:8777',
// tjj
target: 'http://192.168.10.29:13000',
// target: 'http://192.168.10.29:13000',
// target: 'http://test.api.huitongys.com',
// target: 'http://h5uapi.huitongys.com',
changeOrigin: true,

Write Preview
Loading…
Cancel
Save