Browse Source

新增异动信息页面

dev-xx
qb 11 months ago
parent
commit
05d7cecf1c
  1. 36
      src/views/distribution/artery/VehicleArrivalManagement.vue
  2. 35
      src/views/distribution/artery/VehicleStowage.vue
  3. 631
      src/views/finance/TransactionInformation.vue
  4. 1
      src/views/waybill/WaybillOrderList.vue

36
src/views/distribution/artery/VehicleArrivalManagement.vue

@ -175,6 +175,17 @@
</div>
</template>
<el-text style="margin: 0 !important">{{ item.nodeName }}</el-text>
<el-text
:class="
(
details.nodeStatus.find(val => val.value === Number(item.nodeStatus)) || {
className: 'gray',
}
).className
"
>
{{ item.nodeName }}
</el-text>
</el-tooltip>
<!-- <el-text @click="handleGoWaybill(slotProps.scope)">
{{ item.nodeName }}
@ -628,9 +639,9 @@ const details = reactive({
],
/** 节点状态 */
nodeStatus: [
{ label: '未到达', value: 0 },
{ label: '已到车', value: 10 },
{ label: '已发车', value: 20 },
{ label: '未到达', value: 0, className: 'gray' },
{ label: '已到车', value: 10, className: 'green' },
{ label: '已发车', value: 20, className: 'red' },
],
packageColumnList: deepClone(packageColumnList),
/** 配置装车目的地数据 */
@ -1077,7 +1088,7 @@ const handleEndCar = async () => {
};
/** 开启弹窗 */
const handleOpenConfiguration = (type: 'one' | 'batch', data) => {
const handleOpenConfiguration = (type: 'one' | 'batch', data = {}) => {
if (type === 'batch' && details.packageSelectedData.length === 0)
return ElMessage.warning('最少选择一条数据');
details.modifyData = type === 'one' ? [data.row] : details.packageSelectedData;
@ -1329,4 +1340,21 @@ const handleShowUnloadReport = async () => {
text-align: end;
}
}
:deep(.el-text) {
&.gray {
color: #c8a090 !important;
font-weight: bold;
}
&.red {
color: #fe4341 !important;
font-weight: bold;
}
&.green {
color: #5f8689 !important;
font-weight: bold;
}
}
</style>

35
src/views/distribution/artery/VehicleStowage.vue

@ -145,7 +145,17 @@
}}</span>
</div>
</template>
<el-text>{{ item.nodeName }}</el-text>
<el-text
:class="
(
loadStatus.find(val => val.value === Number(item.nodeStatus)) || {
className: 'gray',
}
).className
"
>
{{ item.nodeName }}
</el-text>
</el-tooltip>
<!-- <el-text @click="handleGoWaybill(slotProps.scope)">
{{ item.nodeName }}
@ -586,9 +596,9 @@ const carStateDictionaries = reactive([
]);
const loadStatus = reactive([
{ label: '未到达', value: 0 },
{ label: '已到车', value: 10 },
{ label: '已发车', value: 20 },
{ label: '未到达', value: 0, className: 'gray' },
{ label: '已到车', value: 10, className: 'green' },
{ label: '已发车', value: 20, className: 'red' },
]);
const {
@ -1325,4 +1335,21 @@ const handleShowListOfLoadedWagons = async () => {
max-height: 85vh;
}
}
:deep(.el-text) {
&.gray {
color: #c8a090 !important;
font-weight: bold;
}
&.red {
color: #fe4341 !important;
font-weight: bold;
}
&.green {
color: #5f8689 !important;
font-weight: bold;
}
}
</style>

631
src/views/finance/TransactionInformation.vue

@ -1,9 +1,630 @@
<template>
<div>
</div>
<basic-container>
<!-- 标题 -->
<div class="header"> </div>
<!-- 主体内容 -->
<div class="main">
<!-- 运单 / 订单信息 -->
<div>
<!-- 标题 -->
<div class="header">运单 / 订单信息</div>
<!-- 信息 -->
<div class="info fwb">
<!-- 运单信息 -->
<div class="fwb info_title">
<span class="title"> 运单号 </span>
<span class="text"> 1231231231 </span>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 对账单总金额 () </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 开单时间 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 发站 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 到站 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 品牌 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 发货单位 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 收货单位 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 收货人 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 服务类型 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 运单类型 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
<!-- 订单信息 -->
<div class="fwb mt20 info_title">
<span class="title"> 订单号 </span>
<span class="text"> 1231231231 </span>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 件数 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 重量 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 体积 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 干线费 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 提货费 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 仓储费 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 仓储管理费 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 仓储分拣费 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 仓储操作 / 装卸费 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 配送费 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 配送操作 / 装卸费 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 配送分货费 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 配送上楼费 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 配送平移费 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 安装费 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 保价费 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 申明价值 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 其它费用 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 回扣 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
<!-- 第三方操作费 -->
<div class="fwb info_title mt20">
<span class="title"> 第三方操作费 </span>
<span class="text"> 1231231231 </span>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 支付方式 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 付款方式 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 现付 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 到付 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 月结 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 回付 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 内部结算 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 代收货款 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
<div class="info_row mt10">
<div>
<span class="title"> 代收货款已收 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 售后 </span>
<span class="text"> 1231231231 </span>
</div>
<div>
<span class="title"> 异动金额 </span>
<span class="text"> 1231231231 </span>
</div>
</div>
</div>
</div>
<!-- 异动信息 -->
<div>
<!-- 标题 -->
<div class="header algin_center">
<span> 异动信息 </span>
<span class="title_info">
此处填写要登记的异动的金额整数表示异动增款负数表示异动减款
</span>
</div>
<!-- 表单信息 -->
<el-form class="info" inline>
<div>
<el-form-item label="异动类型:">
<el-radio-group v-model="form.type">
<el-radio label="waybill">运单</el-radio>
<el-radio label="orderCode">订单号</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="异动类型:">
<el-radio-group v-model="form.type">
<el-radio label="waybill">运单</el-radio>
<el-radio label="orderCode">订单号</el-radio>
</el-radio-group>
</el-form-item>
</div>
<el-form-item label="干线费:">
<el-input />
</el-form-item>
<el-form-item label="提货费:">
<el-input />
</el-form-item>
<el-form-item label="仓储费:">
<el-input />
</el-form-item>
<el-form-item label="仓储管理费:">
<el-input />
</el-form-item>
<el-form-item label="仓储分拣费:">
<el-input />
</el-form-item>
<el-form-item label="仓储操作 / 装卸费:">
<el-input />
</el-form-item>
<el-form-item label="配送费:">
<el-input />
</el-form-item>
<el-form-item label="配送操作 / 装卸费:">
<el-input />
</el-form-item>
<el-form-item label="配送分货费:">
<el-input />
</el-form-item>
<el-form-item label="配送上楼费:">
<el-input />
</el-form-item>
<el-form-item label="配送平移费:">
<el-input />
</el-form-item>
<el-form-item label="安装费:">
<el-input />
</el-form-item>
<el-form-item label="报价费:">
<el-input />
</el-form-item>
<el-form-item label="申明价值:">
<el-input />
</el-form-item>
<el-form-item label="其它费用:">
<el-input />
</el-form-item>
<el-form-item label="回扣:">
<el-input />
</el-form-item>
<el-form-item label="第三方操作费:">
<el-input />
</el-form-item>
<el-form-item label="支付方式:">
<el-input />
</el-form-item>
<el-form-item label="付款方式:">
<el-input />
</el-form-item>
<el-form-item label="现付:">
<el-input />
</el-form-item>
<el-form-item label="到付:">
<el-input />
</el-form-item>
<el-form-item label="月结:">
<el-input />
</el-form-item>
<el-form-item label="回付:">
<el-input />
</el-form-item>
<el-form-item label="内部结算:">
<el-input />
</el-form-item>
<el-form-item label="代收货款:">
<el-input />
</el-form-item>
<el-form-item label="代收货款已收:">
<el-input />
</el-form-item>
<el-form-item label="异动时间:">
<el-input />
</el-form-item>
<el-form-item label="结算网点:">
<el-input />
</el-form-item>
<el-form-item label="备注:" class="w100">
<el-input type="textarea" />
</el-form-item>
<el-form-item label="图片:" class="w100">
<el-upload
list-type="picture-card"
v-model:file-list="details.form.fileList"
drag
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
multiple
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
>
<el-icon><Plus /></el-icon>
</el-upload>
</el-form-item>
</el-form>
</div>
<!-- 异动信息 -->
<div>
<!-- 标题 -->
<div class="header algin_center">异动记录</div>
<!-- 表格 -->
<div class="info">
<tablecmt
ref="tableNodeRef"
:columnList="details.columnList"
:tableData="details.data"
:loading="details.loadingObj.list"
/>
</div>
</div>
</div>
</basic-container>
<el-dialog v-model="details.popUpShow.imgVisited">
<img w-full :src="details.dialogImageUrl" alt="图片加载失败" />
</el-dialog>
</template>
<script setup lang="ts"></script>
<script setup lang="ts">
import { ref, reactive, toRefs } from 'vue';
import type { UploadUserFile, UploadProps } from 'element-plus';
const details = reactive({
form: {
/** 异动类型 */
type: 'waybill',
fileList: [
{
name: 'food.jpeg',
url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
},
{
name: 'plant-1.png',
url: '/images/plant-1.png',
},
] as UploadUserFile[],
},
/** 弹窗 */
popUpShow: {
imgVisited: false,
},
dialogImageUrl: '',
data: [],
loadingObj: {
list: false,
},
columnList: [
{
prop: '',
label: '序号',
type: 12,
values: '',
width: 55,
fixed: false,
},
{
prop: 'waybillNo',
label: '异动栏目',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
head: false,
},
{
prop: 'waybillNo',
label: '异动数值',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
head: false,
},
{
prop: 'waybillNo',
label: '异动图片',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
head: false,
},
{
prop: 'waybillNo',
label: '操作人',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
head: false,
},
{
prop: 'waybillNo',
label: '异动操作时间',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
head: false,
},
],
});
const { form } = toRefs(details);
const handlePictureCardPreview: UploadProps['onPreview'] = uploadFile => {
details.dialogImageUrl = uploadFile.url!;
details.popUpShow.imgVisited = true;
};
const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
console.log(uploadFile, uploadFiles);
};
</script>
<style scoped lang="scss">
//
.header {
font-size: 20px;
font-weight: 600;
color: #333333;
// color: var(--el-color-primary);
line-height: 22px;
padding: 16px 24px;
border-bottom: 1px solid #f0f0f0;
.title_info {
color: #f00;
margin-left: 30px;
font-size: 14px;
}
}
//
.main {
// color: var(--el-color-primary);
padding: 0 24px;
width: 100%;
box-sizing: border-box;
//
.header {
border: none;
}
//
.info {
font-size: 14px;
margin: 0 48px;
.info_title {
font-size: 16px;
font-weight: 600;
color: #333333;
line-height: 22px;
}
//
.info_row {
display: flex;
padding: 0 10px;
& > div {
width: 25%;
flex: none;
box-sizing: border-box;
padding: 0 10px;
}
}
:deep(.el-form-item) {
margin: 0;
padding: 10px;
width: 25%;
box-sizing: border-box;
.el-form-item__label {
min-width: 120px;
font-weight: bold;
}
}
}
}
.algin_center {
display: flex;
align-items: center;
}
.w100 {
width: 100% !important;
}
<style scoped lang="scss"></style>
:deep(.el-upload-dragger) {
display: flex;
align-items: center;
justify-content: center;
}
</style>

1
src/views/waybill/WaybillOrderList.vue

@ -104,6 +104,7 @@
"
>
<el-text @click="handleViewOrderDetails(slotProps.scope)"> 查看订单 </el-text>
<el-text @click="handleUploadReceipt(slotProps.scope)"> 上传回单 </el-text>
</template>
</template>
</tablecmt>

Loading…
Cancel
Save