emis-sapp/pages/post/post.vue

213 lines
6.6 KiB
Vue
Raw Normal View History

2023-12-04 01:18:04 +00:00
<template>
2023-12-04 18:08:31 +00:00
<view class="com-jianju pos-rlt" style="padding-top: 2rpx;">
<view class="blcok" style="background-color: #0E0708;">
<u-row>
<image style="height: 28rpx;width: 34rpx;margin-right: 20rpx;" :src="getCdnUrl(`post/gangbo.png`)"></image>
<u-text size="24" color="#fff" text="下单后会有业务员及时联系您,请保持电话畅通!"></u-text>
</u-row>
</view>
<view class="blcok-white">
<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="22" color="#999"></u-text>
</view>
</view>
<view class="flex-column-center">
<image style="height: 32rpx;width: 28rpx;" :src="getCdnUrl(`post/adress.png`)"></image>
<u-text align="center" text="地址薄" size="22" :bold="true" margin="8rpx 0 0 0"></u-text>
</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 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="22" color="#999"></u-text>
</view>
</view>
<view class="flex-column-center">
<image style="height: 32rpx;width: 28rpx;" :src="getCdnUrl(`post/adress.png`)"></image>
<u-text align="center" text="地址薄" size="22" :bold="true" margin="8rpx 0 0 0"></u-text>
</view>
</u-row>
</view>
</view>
<view class="blcok-white">
<view style="width: 80%;">
<tpx-tabs :list="sendTypeList" v-model:value="submitParam.type"
@tabchange="(val)=> { }"
>
</tpx-tabs>
</view>
<view >
<view style="padding: 30rpx 0;border-bottom: 2rpx solid #F6F6F6;;">
<u-row>
<view>
<u-text text="目的国" size="28" :bold="true"></u-text>
</view>
<u-row style="flex: 1;" justify="end" align="center">
<u-text align="right" margin="0 12rpx 0 0" size="22" text="柬埔寨"></u-text>
<u-icon size="22" name="arrow-right" color="#333"></u-icon>
</u-row>
</u-row>
</view>
<view style="padding: 30rpx 0;border-bottom: 2rpx solid #F6F6F6;;">
<u-row>
<view>
<u-text text="选择线路" size="28" :bold="true"></u-text>
</view>
<u-row style="flex: 1;" justify="end" align="center">
<u-text align="right" margin="0 12rpx 0 0" size="22" color="#999" text="请选择"></u-text>
<u-icon size="22" name="arrow-right" color="#333"></u-icon>
</u-row>
</u-row>
</view>
<view style="padding: 30rpx 0;border-bottom: 2rpx solid #F6F6F6;;">
<u-row>
<view>
<u-text text="货物信息(必填)" size="28" :bold="true"></u-text>
</view>
<u-row style="flex: 1;" justify="end" align="center">
<u-text align="right" margin="0 12rpx 0 0" size="22" color="#999" text="填写物品信息"></u-text>
<u-icon size="22" name="arrow-right" color="#333"></u-icon>
</u-row>
</u-row>
</view>
<view style="padding: 30rpx 0;border-bottom: 2rpx solid #F6F6F6;;">
<u-row>
<view>
<u-text text="重量/体积" size="28" :bold="true"></u-text>
</view>
<u-row style="flex: 1;" justify="end" align="center">
<u-text align="right" margin="0 12rpx 0 0" size="22" color="#999" text="填写重量体积"></u-text>
<u-icon size="22" name="arrow-right" color="#333"></u-icon>
</u-row>
</u-row>
</view>
<view style="padding: 30rpx 0;border-bottom: 2rpx solid #F6F6F6;;">
<u-row>
<view>
<u-text text="期望上门时间 " size="28" :bold="true"></u-text>
</view>
<u-row style="flex: 1;" justify="end" align="center">
<u-text align="right" margin="0 12rpx 0 0" size="22" text="1小时内"></u-text>
<u-icon size="22" name="arrow-right" color="#333"></u-icon>
</u-row>
</u-row>
</view>
<view style="padding: 30rpx 0;border-bottom: 2rpx solid #F6F6F6;;">
<u-row>
<view>
<u-text text="付款方式" size="28" :bold="true"></u-text>
</view>
<u-row style="flex: 1;" justify="end" align="center">
<u-text align="right" margin="0 12rpx 0 0" size="22" text="1现金/月结"></u-text>
<u-icon size="22" name="arrow-right" color="#333"></u-icon>
</u-row>
</u-row>
</view>
</view>
</view>
</view>
2023-12-04 01:18:04 +00:00
<!-- 日历 -->
<!-- @close="handleSwitchCladar()" -->
2023-12-04 08:14:24 +00:00
<u-calendar title="请选择日期范围" color="#B12D29" rowHeight="90" closeOnClickOverlay :show="showCladar" :defaultDate="''" @confirm="handleClaOk" @close="handleSwitchCladar"
2023-12-04 01:18:04 +00:00
></u-calendar>
</template>
<script>
import getCdnUrl from "@/common/getCdnUrl"
import { ordStaEnum, ordStatusList, payTypeEnum, payTypeList, dlvTypeEnum, dlvTypeList, dateTypeEnum, dateTypeList } from "@/common/enum"
export default {
props: {
// hasLeftWin: {
// type: Boolean
// }
},
computed: {
2023-12-04 08:14:24 +00:00
2023-12-04 01:18:04 +00:00
},
data() {
return {
2023-12-04 18:08:31 +00:00
sendTypeList: [
{ title: '上门取件', val: 1},
{ title: '仓库收货', val: 2},
{ title: '整柜提货', val: 3}
],
showCladar: false,
submitParam: {
type: 1
}
2023-12-04 01:18:04 +00:00
}
},
onShareAppMessage() {
return {
// title: '',
// path: 'TODO'
}
},
onLoad() {
this.initData();
},
onUnload() {
2023-12-04 08:14:24 +00:00
2023-12-04 01:18:04 +00:00
},
methods: {
getCdnUrl,
initData(){
// uni.showLoading({
// title: '加载中'
// });
},
handleSwitchCladar() {
this.showCladar = !this.showCladar
if(!this.showCladar) {
2023-12-04 08:14:24 +00:00
2023-12-04 01:18:04 +00:00
}
2023-12-04 18:08:31 +00:00
},
handleSendTypeChange(item) {
2023-12-04 01:18:04 +00:00
}
}
}
</script>
<style lang="scss">
@import '../../common/uni-nvue.scss';
page {
background-color: #F6F6F6;
height: 100% !important;
}
</style>
<style scoped lang="scss">
2023-12-04 08:14:24 +00:00
2023-12-04 01:18:04 +00:00
</style>