|
|
@@ -1,416 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="app-content">
|
|
|
- <div class="page-top">
|
|
|
- <div class="page-top-img">
|
|
|
- <img :src="`${constant.imgUrl}/retail/order/bg.png`" mode="widthFix" />
|
|
|
- </div>
|
|
|
- <div class="page-top-det">
|
|
|
- <div>
|
|
|
- <div class="page-status">{{ data.status | constantfilter('ORDER_STATUS') }}</div>
|
|
|
- <!-- <div class="page-prompt">请尽快支付哟~</div> -->
|
|
|
- </div>
|
|
|
- <div class="page-status-img">
|
|
|
- <img :src="data.status == 0 ? waitPayImg : waitDeliveryImg" mode="widthFix" />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 订单详情 -->
|
|
|
- <div class="page-det">
|
|
|
- <!-- 商品信息 -->
|
|
|
- <div class="module-com">
|
|
|
- <div class="module-tit">商品信息</div>
|
|
|
- <div class="module-det">
|
|
|
- <block v-if="!$util.isEmpty(data.goodsInfoList)">
|
|
|
- <list-module
|
|
|
- v-for="(items, subIndex) in data.goodsInfoList"
|
|
|
- :key="subIndex"
|
|
|
- :info="items"
|
|
|
- />
|
|
|
- </block>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 订单信息 -->
|
|
|
- <div class="module-com order-msg">
|
|
|
- <div class="module-tit">订单信息</div>
|
|
|
- <div class="module-det">
|
|
|
- <!-- -->
|
|
|
- <div class="order-msg-blo">
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">收花人</div>
|
|
|
- <div class="value">{{ data.receiveUserName }}</div>
|
|
|
- </div>
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">电话</div>
|
|
|
- <div class="value">{{ data.receiveMobile }}</div>
|
|
|
- </div>
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">地址</div>
|
|
|
- <div class="value">{{ data.receiveFullAddress }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- -->
|
|
|
- <div class="order-msg-blo">
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">送达时间</div>
|
|
|
- <div class="value">{{ data.reachDate || '暂无' }}</div>
|
|
|
- </div>
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">贺卡</div>
|
|
|
- <div class="value">{{ data.needCard == 1 ? "需要" : '不需要' }}</div>
|
|
|
- </div>
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">祝福语</div>
|
|
|
- <div class="value">{{ data.cardInfo || '暂无' }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- -->
|
|
|
- <!-- <div class="order-msg-blo">
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">订花人</div>
|
|
|
- <div class="value">{{ data.bookName }}</div>
|
|
|
- </div>
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">微信</div>
|
|
|
- <div class="value">{{ data.bookName }}</div>
|
|
|
- </div>
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">手机</div>
|
|
|
- <div class="value">{{ data.bookMobile }}</div>
|
|
|
- </div>
|
|
|
- </div>-->
|
|
|
- <!-- -->
|
|
|
- <div class="order-msg-blo">
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">客户评分</div>
|
|
|
- <div class="value">
|
|
|
- <!-- <span>{{ data.totalFlow }}</span> -->
|
|
|
- <rate-module :current="Number(data.totalFlow) || 0" :disabled="true"></rate-module>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">客户留言</div>
|
|
|
- <div class="value">{{ data.evaluate || '暂无' }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- -->
|
|
|
- <div class="order-msg-blo">
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">订单号</div>
|
|
|
- <div class="value">{{ data.orderSn }}</div>
|
|
|
- </div>
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">时间</div>
|
|
|
- <div class="value">{{ data.addTime | formatTime }}</div>
|
|
|
- </div>
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">总价</div>
|
|
|
- <div class="value">¥{{ data.prePrice }}</div>
|
|
|
- </div>
|
|
|
- <div class="msg-list">
|
|
|
- <div class="label">运费</div>
|
|
|
- <div class="value">¥{{ data.sendCost }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 优惠信息 -->
|
|
|
- <div
|
|
|
- class="module-com coupon-wrap"
|
|
|
- v-if="data.discountAmount && data.discountAmount != '0.00'"
|
|
|
- >
|
|
|
- <div class="module-det flex-center-between">
|
|
|
- <div
|
|
|
- class="app-color-3"
|
|
|
- >
|
|
|
-
|
|
|
- <template v-if="data.discountType == 0">未知</template>
|
|
|
- <template v-else-if="data.discountType == 1">优惠券</template>
|
|
|
- <template v-else-if="data.discountType == 2">会员优惠</template>
|
|
|
- <template v-else-if="data.discountType == 3">随机优惠</template>
|
|
|
- <template v-else>未知</template>
|
|
|
-
|
|
|
- </div>
|
|
|
- <div class="app-price">-¥{{ data.discountAmount }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 按钮 -->
|
|
|
- <div class="page-btn app-footer">
|
|
|
- <div class="flex-center">
|
|
|
- <span v-if="data.status == 0">应付款</span>
|
|
|
- <span v-else-if="data.status == 6">已退款</span>
|
|
|
- <span v-else>已付款</span>
|
|
|
- <span class="app-price">
|
|
|
- <span>¥</span>
|
|
|
- <span class="app-size-40">{{ data.actPrice }}</span>
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- <template>
|
|
|
- <!--
|
|
|
- <button class="admin-button-com middle" @click="updatePriceFn">修改价格</button>
|
|
|
- -->
|
|
|
- </template>
|
|
|
- <template>
|
|
|
- <div class="operate-btn-wrap">
|
|
|
- <block v-if="data.status == 0">
|
|
|
- <button class="admin-button-com middle" style="color: #666666;border-color: #dddddd;">自取</button>
|
|
|
- <button class="admin-button-com middle" style="color: #666666;border-color: #dddddd;">发货</button>
|
|
|
- </block>
|
|
|
- <block v-else-if="data.status == 4"></block>
|
|
|
- <block v-else-if="data.status == 6"></block>
|
|
|
- <block v-else-if="data.status == 5">
|
|
|
- <button
|
|
|
- v-if="data.sendType != 1"
|
|
|
- class="admin-button-com default"
|
|
|
- @click="seeSendFn"
|
|
|
- >配送详情</button>
|
|
|
- </block>
|
|
|
- <block v-else>
|
|
|
- <button v-if="data.currentFlow == 1" class="admin-button-com middle" @click.stop="freeShippingFn">自取</button>
|
|
|
- <button
|
|
|
- class="admin-button-com middle"
|
|
|
- @click.stop="pageTo({
|
|
|
- url: '/admin/order/ship',
|
|
|
- query: {
|
|
|
- id: data.id,
|
|
|
- pageStatus: 0
|
|
|
- }
|
|
|
- })"
|
|
|
- >发货</button>
|
|
|
- </block>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <!-- <template v-if="data.status == 5">
|
|
|
- <button class="admin-button-com middle">退款</button>
|
|
|
- </template>-->
|
|
|
- </div>
|
|
|
- <!-- 修改价格 -->
|
|
|
- <modal-module
|
|
|
- :show="updatePriceModal"
|
|
|
- @cancel="modalCancel"
|
|
|
- @click="updateModalClick"
|
|
|
- title="修改价格"
|
|
|
- padding="30rpx 30rpx"
|
|
|
- >
|
|
|
- <template v-slot:content>
|
|
|
- <div class="app-modal-input-wrap">
|
|
|
- <div class="inp-list-line required">
|
|
|
- <!-- <div class="line-label">角色名称</div> -->
|
|
|
- <div class="line-input">
|
|
|
- <input
|
|
|
- v-model="form.price"
|
|
|
- type="text"
|
|
|
- :adjust-position="false"
|
|
|
- class="inp-input"
|
|
|
- placeholder="请输入价格"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </modal-module>
|
|
|
- <!-- 免发货弹窗 -->
|
|
|
- <modal-module
|
|
|
- :show="freeShipModal"
|
|
|
- @cancel="modalCancel"
|
|
|
- @click="freeShipModalClick"
|
|
|
- content="确认客户已自取?"
|
|
|
- color="#333"
|
|
|
- :size="32"
|
|
|
- padding="30rpx 30rpx"
|
|
|
- ></modal-module>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import ListModule from "@/components/module/app-order-list";
|
|
|
-import AppCoupon from "@/components/app-coupon-sel";
|
|
|
-import ModalModule from "@/components/plugin/modal";
|
|
|
-import RateModule from "@/components/plugin/rate";
|
|
|
-// api
|
|
|
-import { getDetB, freeShipping, orderUpdatePrice } from "@/api/order";
|
|
|
-export default {
|
|
|
- name: "order-detail",
|
|
|
- components: {
|
|
|
- ListModule,
|
|
|
- AppCoupon,
|
|
|
- ModalModule,
|
|
|
- RateModule
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- constant: this.$constant,
|
|
|
- // img
|
|
|
- waitPayImg: `${this.$constant.imgUrl}/retail/order/wait-pay.png`,
|
|
|
- waitDeliveryImg: `${this.$constant.imgUrl}/retail/order/wait-delivery.png`,
|
|
|
- data: {},
|
|
|
- // 修改价格
|
|
|
- updatePriceModal: false,
|
|
|
- form: {
|
|
|
- price: ""
|
|
|
- },
|
|
|
- // 免发货
|
|
|
- freeShipModal: false
|
|
|
- };
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- // this.init()
|
|
|
- },
|
|
|
- methods: {
|
|
|
- init() {
|
|
|
- this._getDet();
|
|
|
- },
|
|
|
- _getDet() {
|
|
|
- return getDetB({ id: this.option.id }).then(res => {
|
|
|
- this.data = res.data;
|
|
|
- });
|
|
|
- },
|
|
|
- // 免发货
|
|
|
- freeShippingFn() {
|
|
|
- this.freeShipModal = true;
|
|
|
- },
|
|
|
- // 免发货
|
|
|
- freeShipModalClick(e) {
|
|
|
- if (e.index === 0) {
|
|
|
- this.modalCancel();
|
|
|
- } else {
|
|
|
- this.data.status = 5;
|
|
|
- this.data.sendType = 1;
|
|
|
- freeShipping({ id: this.data.id }).then(res => {
|
|
|
- this.$msg("操作成功!");
|
|
|
- this.modalCancel();
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- // 查看配送
|
|
|
- seeSendFn() {
|
|
|
- this.$util.pageTo({
|
|
|
- url: "/admin/order/ship",
|
|
|
- query: {
|
|
|
- id: this.data.id,
|
|
|
- pageStatus: 5
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- // 修改价格
|
|
|
- updatePriceFn() {
|
|
|
- this.form.price = this.data.prePrice;
|
|
|
- this.updatePriceModal = true;
|
|
|
- },
|
|
|
- updateModalClick(e) {
|
|
|
- if (e.index === 0) {
|
|
|
- this.modalCancel();
|
|
|
- } else {
|
|
|
- orderUpdatePrice({ id: this.data.id, price: this.form.price }).then(
|
|
|
- res => {
|
|
|
- this.modalCancel();
|
|
|
- this.$msg("修改成功!");
|
|
|
- setTimeout(() => {
|
|
|
- this._getDet();
|
|
|
- }, 1000);
|
|
|
- }
|
|
|
- );
|
|
|
- }
|
|
|
- },
|
|
|
- // 关闭弹窗
|
|
|
- modalCancel() {
|
|
|
- this.form.price = "";
|
|
|
- this.freeShipModal = false;
|
|
|
- this.updatePriceModal = false;
|
|
|
- }
|
|
|
- }
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
-.app-content {
|
|
|
- padding-bottom: 80px;
|
|
|
-}
|
|
|
-.page-top {
|
|
|
- position: relative;
|
|
|
- .page-top-det {
|
|
|
- position: absolute;
|
|
|
- top: 22px;
|
|
|
- @include disFlex(center, space-between);
|
|
|
- width: 84%;
|
|
|
- padding: 0 48px;
|
|
|
- color: #fff;
|
|
|
- .page-status {
|
|
|
- font-size: 36px;
|
|
|
- font-weight: bold;
|
|
|
- margin-bottom: 16px;
|
|
|
- }
|
|
|
- .page-prompt {
|
|
|
- color: #ffdede;
|
|
|
- }
|
|
|
- .page-status-img {
|
|
|
- width: 180px;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.page-det {
|
|
|
- width: 94%;
|
|
|
- margin: 0 auto;
|
|
|
- position: relative;
|
|
|
- top: -40px;
|
|
|
- .order-msg {
|
|
|
- .order-msg-blo {
|
|
|
- font-size: 28px;
|
|
|
- padding: 20px 0;
|
|
|
- border-top: 1px solid $borderColor;
|
|
|
- .msg-list {
|
|
|
- @include disFlex(flex-start, space-between);
|
|
|
- margin: 16px 0;
|
|
|
- .label {
|
|
|
- width: 40%;
|
|
|
- color: $fontColor3;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- & .order-msg-blo:first-child {
|
|
|
- border-top: none;
|
|
|
- }
|
|
|
- }
|
|
|
- .coupon-wrap {
|
|
|
- .module-det {
|
|
|
- padding: 20px 0;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-// 底部按钮
|
|
|
-.page-btn {
|
|
|
- width: calc(100% - 60px);
|
|
|
- @include disFlex(center, space-between);
|
|
|
- padding: 0 30px;
|
|
|
- .app-price {
|
|
|
- margin-bottom: 8px;
|
|
|
- margin-left: 4px;
|
|
|
- }
|
|
|
- .red {
|
|
|
- width: 270px;
|
|
|
- }
|
|
|
- .default {
|
|
|
- width: 260px;
|
|
|
- }
|
|
|
- .operate-btn-wrap {
|
|
|
- .admin-button-com {
|
|
|
- margin-left: 30px;
|
|
|
- padding: 20px 30px;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-// 公共模块
|
|
|
-.module-com {
|
|
|
- border-radius: 10px;
|
|
|
- background-color: #fff;
|
|
|
- padding: 0 20px;
|
|
|
- box-shadow: 0px 6px 16px #ddd;
|
|
|
- margin-bottom: 20px;
|
|
|
- .module-tit {
|
|
|
- padding: 20px 0;
|
|
|
- font-size: 28px;
|
|
|
- font-weight: 600;
|
|
|
- border-bottom: 1px solid $borderColor;
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|