|
@@ -1,409 +0,0 @@
|
|
-<template name="orderPopup">
|
|
|
|
- <!--促销活动弹窗提示-->
|
|
|
|
- <view class="orderPopup">
|
|
|
|
- <tui-bottom-popup :radius="true" :show="popupShow" @close="hidePopup()">
|
|
|
|
- <view class="tui-popup-box clearfix">
|
|
|
|
- <template v-if="popupType == 1">
|
|
|
|
- <view class="tui-popup-title">修改收货人信息:</view>
|
|
|
|
- <view class="tui-scrollview-box">
|
|
|
|
- <view class="text-input b-b">
|
|
|
|
- <input class="input" type="text" v-model="receiverInfo.receiverName" placeholder="收货人姓名" placeholder-class="placeholder" />
|
|
|
|
- </view>
|
|
|
|
- <view class="text-input b-b">
|
|
|
|
- <input class="input" type="number" maxlength="11" v-model="receiverInfo.receiverPhone" placeholder="手机号码" placeholder-class="placeholder" />
|
|
|
|
- </view>
|
|
|
|
- <view class="text-input b-b">
|
|
|
|
- <input class="input" type="number" maxlength="11" v-model="receiverInfo.receiverPostCode" placeholder="邮政编码" placeholder-class="placeholder" />
|
|
|
|
- </view>
|
|
|
|
- <view class="text-input b-b" @click="showMulLinkageThreePicker">
|
|
|
|
- <text class="input">
|
|
|
|
- {{receiverInfo.receiverProvince}}{{receiverInfo.receiverCity}}{{receiverInfo.receiverRegion}}
|
|
|
|
- </text>
|
|
|
|
- <text class="iconfont icon-xiayibu"></text>
|
|
|
|
- </view>
|
|
|
|
- <view class="text-textarea b-b">
|
|
|
|
- <view class="textarea show" v-if="isShowInput">{{receiverInfo.receiverDetailAddress ? receiverInfo.receiverDetailAddress :'详细地址:如道路、门牌号、小区、楼房号、单元室等'}}</view>
|
|
|
|
- <textarea v-else
|
|
|
|
- class="textarea"
|
|
|
|
- type="text"
|
|
|
|
- v-model="receiverInfo.receiverDetailAddress"
|
|
|
|
- placeholder="详细地址:如道路、门牌号、小区、楼房号、单元室等"
|
|
|
|
- placeholder-class="placeholder"
|
|
|
|
- maxlength="50"
|
|
|
|
- @input="onTextareaInput"
|
|
|
|
- :class="isShowInput ? '':''"
|
|
|
|
- />
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </template>
|
|
|
|
- <template v-if="popupType == 2">
|
|
|
|
- <view class="tui-popup-title">修改费用信息:</view>
|
|
|
|
- <view class="tui-scrollview-box">
|
|
|
|
- <view class="information-view">
|
|
|
|
- <view class="view-num time">
|
|
|
|
- <view class="view-num-label">商品合计:</view>
|
|
|
|
- <view class="view-num-text">
|
|
|
|
- {{orderInfo.totalAmount}}
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="view-num time">
|
|
|
|
- <view class="view-num-label">优惠券:</view>
|
|
|
|
- <view class="view-num-text">
|
|
|
|
- {{orderInfo.couponAmount}}
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="information-view">
|
|
|
|
- <view class="view-num time">
|
|
|
|
- <view class="view-num-label">积分抵扣:</view>
|
|
|
|
- <view class="view-num-text">
|
|
|
|
- {{orderInfo.integrationAmount}}
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="view-num time">
|
|
|
|
- <view class="view-num-label">活动优惠:</view>
|
|
|
|
- <view class="view-num-text">
|
|
|
|
- {{orderInfo.promotionAmount}}
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="information-view">
|
|
|
|
- <view class="view-num time">
|
|
|
|
- <view class="view-num-label">运费:</view>
|
|
|
|
- <view class="view-num-text">
|
|
|
|
- <input class="input" type="number" maxlength="11" v-model="moneyInfo.freightAmount" placeholder-class="placeholder" />
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="view-num time">
|
|
|
|
- <view class="view-num-label">折扣金额:</view>
|
|
|
|
- <view class="view-num-text">
|
|
|
|
- <input class="input" type="number" maxlength="11" v-model="moneyInfo.discountAmount" placeholder-class="placeholder" />
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="information-view">
|
|
|
|
- <view class="view-num time">
|
|
|
|
- <view class="view-num-label">订单总金额:</view>
|
|
|
|
- <view class="view-num-text">
|
|
|
|
- {{orderInfo.totalAmount+moneyInfo.freightAmount}}
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="view-num time">
|
|
|
|
- <view class="view-num-label">应付款金额:</view>
|
|
|
|
- <view class="view-num-text">
|
|
|
|
- {{orderInfo.payAmount+moneyInfo.freightAmount-moneyInfo.discountAmount}}
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </template>
|
|
|
|
- <template v-if="popupType == 3">
|
|
|
|
- <view class="tui-popup-title">订单备注:</view>
|
|
|
|
- <view class="tui-scrollview-box">
|
|
|
|
- <view class="text-textarea b-b">
|
|
|
|
- <textarea class="textarea"
|
|
|
|
- type="text"
|
|
|
|
- v-model="markInfo.note"
|
|
|
|
- placeholder="备注内容"
|
|
|
|
- placeholder-class="placeholder"
|
|
|
|
- maxlength="100"
|
|
|
|
- />
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </template>
|
|
|
|
- <view class="tui-right-flex tui-popup-btn" :style="{ paddingBottom :isIphoneX ? '68rpx' : '0rpx' }">
|
|
|
|
- <view class="tui-flex-1">
|
|
|
|
- <view class="tui-button cancel" @click="hidePopup()">取消</view>
|
|
|
|
- <view class="tui-button confirm" @click="updataConfirm(popupType)">确定</view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </tui-bottom-popup>
|
|
|
|
- <mpvue-city-picker ref="mpvueCityPicker"
|
|
|
|
- :pickerValueDefault="cityPickerValueDefault"
|
|
|
|
- @onCancel="onCancel"
|
|
|
|
- @onConfirm="onConfirm">
|
|
|
|
- </mpvue-city-picker>
|
|
|
|
- </view>
|
|
|
|
-</template>
|
|
|
|
-
|
|
|
|
-<script>
|
|
|
|
- import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker'
|
|
|
|
- import { mapState,mapMutations } from 'vuex'
|
|
|
|
- const defaultReceiverInfo = {
|
|
|
|
- orderId:null,
|
|
|
|
- receiverName:null,
|
|
|
|
- receiverPhone:null,
|
|
|
|
- receiverPostCode:null,
|
|
|
|
- receiverDetailAddress:null,
|
|
|
|
- receiverProvince:null,
|
|
|
|
- receiverCity:null,
|
|
|
|
- receiverRegion:null,
|
|
|
|
- status:null
|
|
|
|
- };
|
|
|
|
- export default{
|
|
|
|
- name:'orderPopup',
|
|
|
|
- components:{
|
|
|
|
- mpvueCityPicker
|
|
|
|
- },
|
|
|
|
- props:{
|
|
|
|
- orderInfo:{
|
|
|
|
- type:Object,
|
|
|
|
- },
|
|
|
|
- popupType:{
|
|
|
|
- type:Number,
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
- data() {
|
|
|
|
- return{
|
|
|
|
- isIphoneX:this.$store.state.isIphoneX,
|
|
|
|
- receiverInfo:Object.assign({},defaultReceiverInfo),
|
|
|
|
- cityPickerValueDefault: [0, 0, 1],
|
|
|
|
- isShowInput:false,
|
|
|
|
- popupShow:true,
|
|
|
|
- moneyInfo:{
|
|
|
|
- orderId:null,
|
|
|
|
- freightAmount:0,
|
|
|
|
- discountAmount:0,
|
|
|
|
- status:null,
|
|
|
|
- },
|
|
|
|
- markInfo:{note:null},
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- filters: {
|
|
|
|
- NumFormat:function(text) {//处理金额
|
|
|
|
- return Number(text).toFixed(2);
|
|
|
|
- },
|
|
|
|
- formatAddress(order) {
|
|
|
|
- let str = order.receiverProvince;
|
|
|
|
- if (order.receiverCity != null) {
|
|
|
|
- str += " " + order.receiverCity;
|
|
|
|
- }
|
|
|
|
- str += " " + order.receiverRegion;
|
|
|
|
- str += " " + order.receiverDetailAddress;
|
|
|
|
- return str;
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
- created() {
|
|
|
|
- this.receiverInfo={
|
|
|
|
- orderId:this.orderInfo.id,
|
|
|
|
- receiverName:this.orderInfo.receiverName,
|
|
|
|
- receiverPhone:this.orderInfo.receiverPhone,
|
|
|
|
- receiverPostCode:this.orderInfo.receiverPostCode,
|
|
|
|
- receiverDetailAddress:this.orderInfo.receiverDetailAddress,
|
|
|
|
- receiverProvince:this.orderInfo.receiverProvince,
|
|
|
|
- receiverCity:this.orderInfo.receiverCity,
|
|
|
|
- receiverRegion:this.orderInfo.receiverRegion,
|
|
|
|
- status:this.orderInfo.status
|
|
|
|
- }
|
|
|
|
- this.moneyInfo.orderId=this.orderInfo.id;
|
|
|
|
- this.moneyInfo.freightAmount=this.orderInfo.freightAmount;
|
|
|
|
- this.moneyInfo.discountAmount=this.orderInfo.discountAmount;
|
|
|
|
- this.moneyInfo.status=this.orderInfo.status;
|
|
|
|
- },
|
|
|
|
- computed: {
|
|
|
|
- ...mapState(['hasLogin','isWxAuthorize'])
|
|
|
|
- },
|
|
|
|
- methods:{
|
|
|
|
- // 三级联动选择
|
|
|
|
- showMulLinkageThreePicker() {
|
|
|
|
- this.isShowInput = true
|
|
|
|
- this.$refs.mpvueCityPicker.show()
|
|
|
|
- },
|
|
|
|
- onConfirm(e) {
|
|
|
|
- console.log(e)
|
|
|
|
- this.isShowInput = false
|
|
|
|
- this.receiverInfo.receiverProvince=e.province;
|
|
|
|
- this.receiverInfo.receiverCity=e.city;
|
|
|
|
- this.receiverInfo.receiverRegion=e.region;
|
|
|
|
- },
|
|
|
|
- onCancel(e) {
|
|
|
|
- console.log(e)
|
|
|
|
- },
|
|
|
|
- hidePopup(){
|
|
|
|
- this.popupShow = false
|
|
|
|
- this.$parent.isPopupShow = false
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- updataConfirm(type){
|
|
|
|
- switch(this.popupType){
|
|
|
|
- case 1:
|
|
|
|
- this.$emit('popupTypeConfirm',this.receiverInfo)
|
|
|
|
- this.popupShow = false
|
|
|
|
- break;
|
|
|
|
- case 2:
|
|
|
|
- this.$emit('popupTypeConfirm',this.moneyInfo)
|
|
|
|
- this.popupShow = false
|
|
|
|
- break;
|
|
|
|
- case 3:
|
|
|
|
- let params = new URLSearchParams();
|
|
|
|
- params.append("id",this.markInfo.id);
|
|
|
|
- params.append("note",this.markInfo.note);
|
|
|
|
- params.append("status",this.order.status);
|
|
|
|
- this.$emit('popupTypeConfirm',params)
|
|
|
|
- this.popupShow = false
|
|
|
|
- break;
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-</script>
|
|
|
|
-
|
|
|
|
-<style lang="scss">
|
|
|
|
- .tui-flex-1 {
|
|
|
|
- flex: 1;
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: center;
|
|
|
|
- }
|
|
|
|
- .tui-popup-title{
|
|
|
|
- line-height: 80rpx;
|
|
|
|
- font-size: $font-size-28;
|
|
|
|
- color: $text-color;
|
|
|
|
- padding: 0 24rpx;
|
|
|
|
- }
|
|
|
|
- .tui-popup-box {
|
|
|
|
- position: relative;
|
|
|
|
- box-sizing: border-box;
|
|
|
|
- min-height: 220rpx;
|
|
|
|
- padding:0 24rpx 0 24rpx;
|
|
|
|
- }
|
|
|
|
- .text-textarea{
|
|
|
|
- width: 100%;
|
|
|
|
- height: 216rpx;
|
|
|
|
- padding: 24rpx;
|
|
|
|
- background: #F7F7F7;
|
|
|
|
- .textarea{
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- font-size: $font-size-28;
|
|
|
|
- color: $text-color;
|
|
|
|
- z-index: 1;
|
|
|
|
- }
|
|
|
|
- .textarea.hide{
|
|
|
|
- opacity: 0;
|
|
|
|
- }
|
|
|
|
- .textarea.show{
|
|
|
|
- color: #999999;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .tui-scrollview-box{
|
|
|
|
- width: 100%;
|
|
|
|
- height: auto;
|
|
|
|
- float: left;
|
|
|
|
- box-sizing: border-box;
|
|
|
|
- .information-view{
|
|
|
|
- height: 60rpx;
|
|
|
|
- line-height: 60rpx;
|
|
|
|
- font-size: $font-size-28;
|
|
|
|
- color: $text-color;
|
|
|
|
- margin: 4rpx 0;
|
|
|
|
- display: flex;
|
|
|
|
- .view-num{
|
|
|
|
- flex: 1;
|
|
|
|
- color: $text-color;
|
|
|
|
- text-align: left;
|
|
|
|
- .view-num-label{
|
|
|
|
- text-align: left;
|
|
|
|
- float: left;
|
|
|
|
- color: $text-color;
|
|
|
|
- }
|
|
|
|
- .view-num-text{
|
|
|
|
- float: left;
|
|
|
|
- text-align: left;
|
|
|
|
- color: #999999;
|
|
|
|
- .input{
|
|
|
|
- width: 150rpx;
|
|
|
|
- height: 60rpx;
|
|
|
|
- border: 1px solid #EBEBEB;
|
|
|
|
- border-radius: 4rpx;
|
|
|
|
- padding: 0 15rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .view-num.ord{
|
|
|
|
- color: $color-system;
|
|
|
|
- text-align: left;
|
|
|
|
- flex:3;
|
|
|
|
- font-weight: bold;
|
|
|
|
- }
|
|
|
|
- .view-num.time{
|
|
|
|
- color: #999999;
|
|
|
|
- }
|
|
|
|
- .bold{
|
|
|
|
- font-weight: bold;
|
|
|
|
- }
|
|
|
|
- .red{
|
|
|
|
- color: #FF2A2A;
|
|
|
|
- }
|
|
|
|
- .view-type{
|
|
|
|
- float: right;
|
|
|
|
- text-align: right;
|
|
|
|
- color: #FF2A2A;
|
|
|
|
- flex: 2;
|
|
|
|
- }
|
|
|
|
- .clipboard{
|
|
|
|
- width: 84rpx;
|
|
|
|
- height: 36rpx;
|
|
|
|
- background: #EBEBEB;
|
|
|
|
- text-align: center;
|
|
|
|
- font-size: $font-size-24;
|
|
|
|
- color: #999999;
|
|
|
|
- border-radius: 18rpx;
|
|
|
|
- line-height: 36rpx;
|
|
|
|
- display: inline-block;
|
|
|
|
- margin-left: 42rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .tui-popup-btn {
|
|
|
|
- width: 100%;
|
|
|
|
- height: auto;
|
|
|
|
- float: left;
|
|
|
|
- margin-top: 24rpx;
|
|
|
|
- .tui-button{
|
|
|
|
- width: 40%;
|
|
|
|
- flex: 1;
|
|
|
|
- height: 70rpx;
|
|
|
|
- background: $btn-confirm;
|
|
|
|
- line-height: 70rpx;
|
|
|
|
- text-align: center;
|
|
|
|
- color: #FFFFFF;
|
|
|
|
- font-size: $font-size-26;
|
|
|
|
- border-radius: 8rpx;
|
|
|
|
- margin: 0 5%;
|
|
|
|
- &.cancel{
|
|
|
|
- background-color:#f6f6f6;
|
|
|
|
- color: #333333;
|
|
|
|
- }
|
|
|
|
- &.confirm{
|
|
|
|
- background-color:#4688fa;
|
|
|
|
- color: #FFFFFF;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-</style>
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|