增加详情
This commit is contained in:
aihe
parent
a99aae1297
commit
e7609378df
@ -194,15 +194,34 @@
|
||||
.font-28 {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.font-30 {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.font-32 {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.clr-sub{
|
||||
color: #999;
|
||||
}
|
||||
.clr-prm{
|
||||
color: #B12D29;;
|
||||
}
|
||||
.font-weight{
|
||||
font-weight: 600;
|
||||
}
|
||||
.radius-10{
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.radius-20{
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
.com-tag-grey{
|
||||
font-size: 26rpx;
|
||||
background-color: rgb(246, 246, 246);
|
||||
color: rgb(102, 102, 102);
|
||||
border-radius: 10rpx;
|
||||
padding: 12rpx 16rpx;
|
||||
}
|
||||
|
||||
page{
|
||||
// font-size: 22rpx;
|
||||
|
||||
12
pages.json
12
pages.json
@ -44,6 +44,18 @@
|
||||
"navigationBarTitleText": "上门取件"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/post/detail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "运单详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/post/locus",
|
||||
"style": {
|
||||
"navigationBarTitleText": "物流轨迹"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/address/list",
|
||||
"style": {
|
||||
|
||||
@ -79,7 +79,7 @@
|
||||
<view v-for="(orItem) in dataList" class="ord-list-item" >
|
||||
<u-row justify="between">
|
||||
<text>T7080123982307</text>
|
||||
<view class="kpsat">
|
||||
<view class="com-tag-grey font-26">
|
||||
{{'未开票'}}
|
||||
</view>
|
||||
</u-row>
|
||||
@ -317,11 +317,4 @@
|
||||
flex: 1;
|
||||
position: relative;
|
||||
}
|
||||
.kpsat{
|
||||
font-size: 26rpx;
|
||||
background-color: rgb(246, 246, 246);
|
||||
color: rgb(102, 102, 102);
|
||||
border-radius: 10rpx;
|
||||
padding: 12rpx 16rpx;
|
||||
}
|
||||
</style>
|
||||
315
pages/post/detail.vue
Normal file
315
pages/post/detail.vue
Normal file
@ -0,0 +1,315 @@
|
||||
<template>
|
||||
<tpx-layout>
|
||||
<template v-slot:header></template>
|
||||
<template v-slot:body>
|
||||
<view class="dt-block">
|
||||
<view class="dt-tle">
|
||||
<view class="t1">订单号: Tw891823727001</view>
|
||||
<view class="t2">
|
||||
<text class="clr-prm">{{'待遗收'}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<u-line margin="20rpx 0 20rpx"></u-line>
|
||||
<view>
|
||||
<u-row custom-style="position:relative;" align="top"
|
||||
justify="between">
|
||||
<view>
|
||||
<image style="height: 50rpx;width: 42rpx;" :src="getCdnUrl(`post/ji.png`)"></image>
|
||||
</view>
|
||||
<view style="flex: 1;padding: 0 30rpx;">
|
||||
<u-text text="寄件人信息" size="28" :bold="true"></u-text>
|
||||
<view style="margin: 8rpx 0 0 0;">
|
||||
<u-text text="请新建您的寄件地址信息" size="26" color="#999"></u-text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-column-center">
|
||||
<image style="height: 32rpx;width: 28rpx;" :src="getCdnUrl(`post/adress.png`)">
|
||||
</image>
|
||||
</view>
|
||||
<view style="position: absolute;left: 20rpx;bottom: -20rpx;top: 46rpx;">
|
||||
<u-line custom-style="height:100%;" direction="col" dashed="true"></u-line>
|
||||
</view>
|
||||
</u-row>
|
||||
<view style="padding-left: 76rpx;">
|
||||
<u-line margin="20rpx 0"></u-line>
|
||||
</view>
|
||||
<u-row custom-style="position:relative;" align="top"
|
||||
justify="between">
|
||||
<view style="position: absolute;left: 20rpx;top: -20rpx;bottom: 100%;">
|
||||
<u-line custom-style="height:100%;" direction="col" dashed="true"></u-line>
|
||||
</view>
|
||||
<view>
|
||||
<image style="height: 50rpx;width: 42rpx;" :src="getCdnUrl(`post/shou.png`)">
|
||||
</image>
|
||||
</view>
|
||||
<view class="pr-30 pl-30" style="flex: 1;">
|
||||
<u-text text="收件人信息" size="28" :bold="true"></u-text>
|
||||
<view style="margin: 8rpx 0 0 0;">
|
||||
<u-text text="请填写收件人国家、姓名，电话" size="26" color="#999"></u-text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-column-center">
|
||||
<image style="height: 32rpx;width: 28rpx;" :src="getCdnUrl(`post/adress.png`)">
|
||||
</image>
|
||||
</view>
|
||||
</u-row>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="dt-block">
|
||||
<view class="dt-tle">
|
||||
<view class="t1">托寄货物描述</view>
|
||||
<view class="t2">
|
||||
<text class="clr-prm">{{'待确认'}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<u-line margin="20rpx 0 20rpx"></u-line>
|
||||
<view v-for="(item) in ydList" class="yditem">
|
||||
<view class="ydi-lab">
|
||||
<text class="font-weight">女士针织棉上衣</text>
|
||||
<text>预报: 300</text>
|
||||
</view>
|
||||
<view class="ydi-lab mt-10">
|
||||
<text class="clr-sub">无 12L 中国内地</text>
|
||||
<text>实入仓: 0</text>
|
||||
</view>
|
||||
<view class="ydi-lab mt-10">
|
||||
<text class="clr-prm">12 CNY</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="dt-item">
|
||||
<view class="font-weight">
|
||||
<text>总重量:50kg</text>
|
||||
<text class="pl-20">总体积:50m</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<u-row justify="end">
|
||||
<view style="display: inline-block;white-space: nowrap;" class="mt-10">
|
||||
<u-row>
|
||||
<u-button shape="circle" type="primary"
|
||||
custom-style="height: 54rpx;margin-left: 20rpx;">进仓单</u-button>
|
||||
<u-button shape="circle" type="primary" :plain="true"
|
||||
custom-style="height: 54rpx;margin-left: 20rpx;">补单证资料</u-button>
|
||||
</u-row>
|
||||
</view>
|
||||
</u-row>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="dt-block">
|
||||
<view class="dt-tle">
|
||||
<view class="t1">产品类型及费用</view>
|
||||
<view class="t2">
|
||||
<text class="clr-prm">{{'已付款/待付款月结'}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<u-line margin="20rpx 0 20rpx"></u-line>
|
||||
<view class="dt-item">
|
||||
<view>
|
||||
<text>目的国家:</text>
|
||||
<text class="font-weight">柬埔寨</text>
|
||||
</view>
|
||||
<view>
|
||||
<text>线路:</text>
|
||||
<text class="font-weight">柬埔寨快递</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view>
|
||||
<text>产品类型:</text>
|
||||
<text class="font-weight">柬埔寨国际特快</text>
|
||||
</view>
|
||||
<view>
|
||||
<text>时效:</text>
|
||||
<text class="font-weight">23天</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view>
|
||||
<text>基础运费:</text>
|
||||
<text class="font-weight">￥80.00</text>
|
||||
</view>
|
||||
<view>
|
||||
<text>付款方式:</text>
|
||||
<text class="font-weight">寄付现结</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view>
|
||||
<text>报关方式:</text>
|
||||
<text class="font-weight">快递报关</text>
|
||||
</view>
|
||||
<view>
|
||||
<text>清关方式:</text>
|
||||
<text class="font-weight">快递清关</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view>
|
||||
<text>运费:</text>
|
||||
<text class="clr-prm font-32">￥ 80.00</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="dt-block">
|
||||
<view class="dt-tle">
|
||||
<view class="t1">取件信息</view>
|
||||
<view class="t2">
|
||||
<text class="clr-prm">{{'已付款/待付款月结'}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<u-line margin="20rpx 0 20rpx"></u-line>
|
||||
<view class="dt-item">
|
||||
<view>
|
||||
<text>取货方式:</text>
|
||||
<text class="font-weight">上门取件 整柜提货</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view>
|
||||
<text>预约上门:</text>
|
||||
<text class="font-weight"> 2023 11-22 09:00 - 10:00</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view>
|
||||
<text>安排信息:</text>
|
||||
<text class="font-weight">已安排快递员上门取货</text>
|
||||
</view>
|
||||
</view>
|
||||
<u-line margin="20rpx 0 10rpx 0"></u-line>
|
||||
<u-row justify="between">
|
||||
<u-text text="快递员" size="28" :bold="true"></u-text>
|
||||
<u-row>
|
||||
<u-text text="李晓" size="28" :bold="true" margin="0 30rpx 0 0"></u-text>
|
||||
<view>
|
||||
<u-avatar size="50" :src="''"></u-avatar>
|
||||
</view>
|
||||
</u-row>
|
||||
</u-row>
|
||||
</view>
|
||||
|
||||
<view class="dt-block">
|
||||
<view class="dt-tle">
|
||||
<view class="t1">物流动态</view>
|
||||
<view class="t2">
|
||||
<u-button shape="circle" :plain="true" custom-style="height: 50rpx;font-size:28rpx;">查看轨迹</u-button>
|
||||
</view>
|
||||
</view>
|
||||
<u-line margin="20rpx 0 20rpx"></u-line>
|
||||
<view class="dt-item">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template v-slot:footer>
|
||||
<view class="blcok-white-noradius">
|
||||
<u-row justify="space-around">
|
||||
<u-button :plain="true" size="large" shape="circle" custom-style="margin: 0 10rpx;height:80rpx;font-size: 30rpx;"
|
||||
>修改
|
||||
</u-button>
|
||||
<u-button :plain="true" size="large" shape="circle" custom-style="margin: 0 10rpx;height:80rpx;font-size: 30rpx;"
|
||||
>取消
|
||||
</u-button>
|
||||
<u-button type="primary" size="large" shape="circle" custom-style="margin: 0 10rpx;height:80rpx;font-size: 30rpx;"
|
||||
>再来一单
|
||||
</u-button>
|
||||
</u-row>
|
||||
</view>
|
||||
</template>
|
||||
</tpx-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import getCdnUrl from "@/common/getCdnUrl"
|
||||
import { goto, goBack, setClipboardData, confirmModal, showLoading } from "@/common/untool"
|
||||
|
||||
export default {
|
||||
props: {
|
||||
// hasLeftWin: {
|
||||
// type: Boolean
|
||||
// }
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
ydList: [
|
||||
{},{},{}
|
||||
]
|
||||
}
|
||||
},
|
||||
onShareAppMessage() {
|
||||
return {
|
||||
// title: '',
|
||||
// path: 'TODO'
|
||||
}
|
||||
},
|
||||
onLoad(queryOption) {
|
||||
this.queryOption = queryOption
|
||||
this.searchParam.tabType = queryOption.tab || tabList[0].val
|
||||
this.initData();
|
||||
},
|
||||
onUnload() {
|
||||
},
|
||||
methods: {
|
||||
getCdnUrl,
|
||||
initData(){
|
||||
// showLoading()
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import '@/common/uni-nvue.scss';
|
||||
page {
|
||||
background-color: #F6F6F6;
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
.dt-block {
|
||||
margin-top: 30rpx;
|
||||
padding: 30rpx;
|
||||
background-color: #FFF;
|
||||
position: relative;
|
||||
}
|
||||
.dt-tle {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
.t1 {
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
.t2{
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
.dt-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 20rpx;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.yditem{
|
||||
padding: 20rpx 20rpx;
|
||||
background-color: #F6F6F6;
|
||||
border-radius: 10rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.ydi-lab{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
181
pages/post/locus.vue
Normal file
181
pages/post/locus.vue
Normal file
@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="dt-head">
|
||||
<u-text :text="'账单信息'" size="30" :bold="true"></u-text>
|
||||
<u-line margin="20rpx 0 20rpx"></u-line>
|
||||
<view class="dt-item">
|
||||
<view class="lb1">账单编号</view>
|
||||
<view class="lb2">{{'T7080123982301'}}</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view class="lb1">出账日期</view>
|
||||
<view class="lb2">{{'2023-11-20 13:28:56'}}</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view class="lb1">总票数</view>
|
||||
<view class="lb2">{{'1'}}</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view class="lb1">总件数</view>
|
||||
<view class="lb2">{{'20'}}</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view class="lb1">总重量</view>
|
||||
<view class="lb2">{{'120.00 kg'}}</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view class="lb1">应付金额</view>
|
||||
<view class="lb2">{{'1225.00 CNY'}}</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view class="lb1">已付金额</view>
|
||||
<view class="lb2">{{'0.00 CNY'}}</view>
|
||||
</view>
|
||||
<view class="dt-item">
|
||||
<view class="lb1">开票状态</view>
|
||||
<view class="lb2">{{'未开票'}}</view>
|
||||
</view>
|
||||
|
||||
<view class="dt-item mt-30">
|
||||
<view class="lb1">收款账户</view>
|
||||
<view class="lb2">
|
||||
<u-row >
|
||||
<u-avatar size="80" shape="square"></u-avatar>
|
||||
<view class="pl-10">
|
||||
<u-text :text="'江苏探路者国际物流有限公司'" size="28" :bold="true" ></u-text>
|
||||
<u-text :text="'介绍'" size="26" color="#666" margin="10rpx 0 0 0"></u-text>
|
||||
</view>
|
||||
</u-row>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dt-item mt-30">
|
||||
<view class="lb1">支付金额</view>
|
||||
<view class="zhfxin">
|
||||
<view style="text-align: center;width: 300rpx;">
|
||||
<u-image height="300" width="300" radius="10"></u-image>
|
||||
<view class="mt-10" style="display: inline-block;">
|
||||
<u-text :text="'￥1225.00'" size="32" :bold="true" color="#B12D29" align="center"></u-text>
|
||||
</view>
|
||||
</view>
|
||||
<u-text margin="20rpx 0 0 0" :text="'请使用微信或支付宝扫以上码支付'" size="28" :bold="true"></u-text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="dt-body">
|
||||
<u-text :text="'运单列表'" size="30" :bold="true"></u-text>
|
||||
<u-line margin="20rpx 0 20rpx"></u-line>
|
||||
<view v-for="(item) in ydList" class="yditem">
|
||||
<view class="ydi-lab">
|
||||
<view>
|
||||
<u-text :text="'运单号'" size="28" color="#999"></u-text>
|
||||
</view>
|
||||
<view>
|
||||
<u-text :text="'T81823778123'" size="28" :bold="true" align="right"></u-text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="ydi-lab mt-10">
|
||||
<view>
|
||||
<u-text :text="'应付金额'" size="28" color="#999"></u-text>
|
||||
</view>
|
||||
<view>
|
||||
<u-text :text="'￥30.00'" size="28" :bold="true" color="#B12D29" align="right"></u-text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import getCdnUrl from "@/common/getCdnUrl"
|
||||
import { goto, goBack, setClipboardData, confirmModal, showLoading } from "@/common/untool"
|
||||
|
||||
export default {
|
||||
props: {
|
||||
// hasLeftWin: {
|
||||
// type: Boolean
|
||||
// }
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
ydList: [
|
||||
{},{},{}
|
||||
]
|
||||
}
|
||||
},
|
||||
onShareAppMessage() {
|
||||
return {
|
||||
// title: '',
|
||||
// path: 'TODO'
|
||||
}
|
||||
},
|
||||
onLoad(queryOption) {
|
||||
this.queryOption = queryOption
|
||||
this.searchParam.tabType = queryOption.tab || tabList[0].val
|
||||
this.initData();
|
||||
},
|
||||
onUnload() {
|
||||
},
|
||||
methods: {
|
||||
getCdnUrl,
|
||||
initData(){
|
||||
// showLoading()
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import '@/common/uni-nvue.scss';
|
||||
page {
|
||||
background-color: #F6F6F6;
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
.dt-head {
|
||||
margin-top: 30rpx;
|
||||
padding: 30rpx;
|
||||
background-color: #FFF;
|
||||
position: relative;
|
||||
}
|
||||
.dt-body{
|
||||
margin-top: 30rpx;
|
||||
padding: 30rpx;
|
||||
background-color: #FFF;
|
||||
position: relative;
|
||||
}
|
||||
.dt-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 20rpx;
|
||||
.lb1 {
|
||||
width: 160rpx;
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
}
|
||||
.lb2{
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
.zhfxin{
|
||||
}
|
||||
.yditem{
|
||||
padding: 20rpx 20rpx;
|
||||
background-color: #F6F6F6;
|
||||
border-radius: 6rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.ydi-lab{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
@ -90,7 +90,7 @@
|
||||
<u-icon @click="handleDealItem(orItem, { type: 3 })" name="trash"></u-icon>
|
||||
</u-row>
|
||||
|
||||
<u-row custom-style="margin-top: 30rpx;" justify="center">
|
||||
<u-row @click="handleDealItem(orItem, { type: 1 })" custom-style="margin-top: 30rpx;" justify="center">
|
||||
<u-col span="4">
|
||||
<u-text :text="'中国上海'" size="30" :bold="true" align="center"></u-text>
|
||||
<u-text :text="'张三'" size="26" color="#999" margin="20rpx 0 0 0"
|
||||
@ -115,12 +115,12 @@
|
||||
<u-line color="#DEDEDE" margin="30rpx 0 0 0"></u-line>
|
||||
|
||||
<u-row justify="end" custom-style="margin-top:20rpx;">
|
||||
<view style="display: inline-block;">
|
||||
<view style="display: inline-block;white-space: nowrap;">
|
||||
<u-row>
|
||||
<u-button shape="circle" type="primary" :plain="true"
|
||||
custom-style="height: 54rpx;margin-left: 12rpx;white-space: nowrap;">进仓确认</u-button>
|
||||
custom-style="height: 54rpx;margin-left: 12rpx;">进仓确认</u-button>
|
||||
<u-button shape="circle" type="primary"
|
||||
custom-style="height: 54rpx;margin-left: 12rpx;white-space: nowrap;">再来一单</u-button>
|
||||
custom-style="height: 54rpx;margin-left: 12rpx;">再来一单</u-button>
|
||||
<!-- <u-button shape="circle" type="primary" :plain="true" custom-style="height: 54rpx;margin-left: 16rpx;">单据</u-button> -->
|
||||
<u-button @click="handleDealItem(orItem, { type: 4 })" shape="circle" type="primary"
|
||||
:plain="true" custom-style="height: 54rpx;margin-left: 12rpx;">取消</u-button>
|
||||
@ -258,6 +258,7 @@
|
||||
async handleDealItem(item, deal = { type: '1' }) {
|
||||
switch (deal.type){
|
||||
case 1: // 跳转
|
||||
goto(`post/detail?id=${item.id}`)
|
||||
break;
|
||||
case 2: // 复制订单号
|
||||
setClipboardData('xxxxxxx')
|
||||
|
||||
BIN
static/images/post/call.png
Normal file
BIN
static/images/post/call.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
BIN
static/images/post/hwu-check.png
Normal file
BIN
static/images/post/hwu-check.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
BIN
static/images/post/hwu-un.png
Normal file
BIN
static/images/post/hwu-un.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
BIN
static/images/post/run.png
Normal file
BIN
static/images/post/run.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Loading…
Reference in New Issue
Block a user