|
@@ -1,107 +0,0 @@
|
|
|
-<template>
|
|
|
- <el-drawer
|
|
|
- title="订单发货"
|
|
|
- :visible.sync="drawer"
|
|
|
- :direction="direction"
|
|
|
- size="40%">
|
|
|
- <div class="content">
|
|
|
- <!-- <deliveryGoodsInfo />
|
|
|
- <deliveryPrice /> -->
|
|
|
- </div>
|
|
|
- <div class="space"></div>
|
|
|
- <div class="deli-footer">
|
|
|
- <div class="d-left">
|
|
|
- <div class="estimate-total">
|
|
|
- 预计总价<span class="total">¥16.00</span> <span class="detail" @click="jump">明细></span>
|
|
|
- </div>
|
|
|
- <div class="agreement">
|
|
|
- <el-checkbox v-model="checked">已读并同意《XXX电子运单协议》</el-checkbox>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="send-btn" @click="btn">确认发货</div>
|
|
|
- </div>
|
|
|
- <deliveryDetail ref="deliveryDetail" />
|
|
|
- </el-drawer>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script lang="ts">
|
|
|
-import { Component, Prop, Vue, Watch } from "vue-property-decorator";
|
|
|
-import DeliveryGoodsInfo from "./deliveryGoodsInfo.vue";
|
|
|
-import DeliveryPrice from "./deliveryPrice.vue";
|
|
|
-import deliveryDetail from './deliveryDetail.vue'
|
|
|
-@Component({components:{DeliveryGoodsInfo,DeliveryPrice,deliveryDetail}})
|
|
|
-export default class DeliveryModal extends Vue {
|
|
|
- drawer=false;
|
|
|
- direction='rtl'
|
|
|
- checked=false;
|
|
|
- value:any={}
|
|
|
- setShow(v:boolean){
|
|
|
- this.drawer=v;
|
|
|
- }
|
|
|
- btn(){
|
|
|
- this.drawer = false;
|
|
|
- this.$emit('sendHandle')
|
|
|
- }
|
|
|
- jump(){
|
|
|
- if(this.$refs.deliveryDetail){
|
|
|
- (this.$refs.deliveryDetail as any).setShow(true);
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|
|
|
-<style lang="scss" scoped>
|
|
|
-.content{
|
|
|
- width: 100%;
|
|
|
- box-sizing: border-box;
|
|
|
- padding: 0 16px;
|
|
|
- background-color: #FFF;
|
|
|
-
|
|
|
-}
|
|
|
-.deli-footer{
|
|
|
- height: 60px;
|
|
|
- width: 100%;
|
|
|
- padding: 0 16px;
|
|
|
- box-sizing: border-box;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- position: absolute;
|
|
|
- background-color: #FFF;
|
|
|
- left: 0;
|
|
|
- bottom: 0;
|
|
|
- z-index: 10;
|
|
|
- .d-left{
|
|
|
- width: 70%;
|
|
|
- .estimate-total{
|
|
|
- font-size: 14px;
|
|
|
- padding-bottom: 4px;
|
|
|
- .total{
|
|
|
- font-size: 16px;
|
|
|
- color: #F00;
|
|
|
- }
|
|
|
- .detail{
|
|
|
- color: #1684FC;
|
|
|
- padding-left: 16px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .send-btn{
|
|
|
- width: 120px;
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
- border-radius: 8px;
|
|
|
- background: linear-gradient(129.2deg, rgba(22,132,252,1) 9.81%,rgba(93,167,249,1) 97.4%);
|
|
|
- color: rgba(255, 255, 255, 100);
|
|
|
- font-size: 14px;
|
|
|
- text-align: center;
|
|
|
- box-shadow: 0px 2px 6px 0px rgba(93, 167, 249, 100);
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
-}
|
|
|
-.space{
|
|
|
- height: 60px;
|
|
|
- width: 100%;
|
|
|
- margin-top: 16px;
|
|
|
-}
|
|
|
-</style>
|