rk
16 小时以前 b908f030726721a2077fa2af924f35e2df9a24e1
admin/src/components/business/OperaOrderDetail.vue
@@ -2,17 +2,18 @@
  <GlobalWindow
    :title="title"
    :visible.sync="visible"
    width="900px"
    width="1000px"
    :withFooter="false"
  >
    <div class="order-detail" v-if="detailInfo">
      <div class="section">
        <div class="section-header">
          <span class="section-title">订单详情</span>
          <el-tag v-if="detailInfo.status === 1" type="warning">待取件</el-tag>
          <el-tag v-else-if="detailInfo.status === 2" type="primary">配送中</el-tag>
          <el-tag v-else-if="detailInfo.status === 3" type="success">已完成</el-tag>
          <el-tag v-else-if="detailInfo.status === 4" type="info">已取消</el-tag>
          <el-tag v-if="detailInfo.order && detailInfo.order.status === 4" type="primary">{{detailInfo.statusDesc}}</el-tag>
          <el-tag v-else-if="detailInfo.order && detailInfo.order.status <7" type="warning" >{{detailInfo.statusDesc}}</el-tag>
          <el-tag  v-else-if="detailInfo.order && detailInfo.order.status ===7"  type="success">{{detailInfo.statusDesc}}</el-tag>
          <el-tag v-else   type="info">{{detailInfo.statusDesc}}</el-tag>
          <el-button style="" type="primary" @click="showLogList" >加急日志</el-button>
        </div>
        <div class="info-grid">
          <div class="info-item">
@@ -27,7 +28,7 @@
            <span class="label">订单类型:</span>
            <span class="value">
              <span v-if="detailInfo.order.type === 0">就地存取</span>
              <span v-else-if="detailInfo.order.type === 1">异地存取</span>
              <span v-else-if="detailInfo.order.type === 1">同城寄送</span>
              <span v-else>-</span>
            </span>
          </div>
@@ -49,9 +50,9 @@
            </span>
          </div>
          <div class="info-item">
          <div class="info-item" v-if="detailInfo.order.type ===1">
            <span class="label">订单级别:</span>
            <span class="value">{{ detailInfo.order.orderLevel || '-' }}</span>
            <span class="value">{{ detailInfo.order.isUrgent === 1?'极速达':'标速达' }}</span>
          </div>
          <div class="info-item">
            <span class="label">预计到店时间:</span>
@@ -74,8 +75,9 @@
            <span class="value">¥{{ (detailInfo.order.declaredFee / 100).toFixed(2) }}</span>
          </div>
          <div class="info-item">
            <span class="label">预计寄存天数/配送里程:</span>
            <span class="value">{{ detailInfo.order.estimatedDepositDays || '-' }}天/{{ detailInfo.order.distance || '-' }}公里</span>
            <span class="label">{{detailInfo.order.type === 0 ? '预计寄存天数' : '配送里程'}}:</span>
            <span class="value" v-if="detailInfo.order.type === 0">{{ detailInfo.order.estimatedDepositDays || '-' }}天</span>
            <span class="value" v-if="detailInfo.order.type === 1">{{ detailInfo.order.distance || '-' }}公里</span>
          </div>
          <div class="info-item full-width">
            <span class="label">客户备注:</span>
@@ -83,13 +85,13 @@
          </div>
          <div class="info-item full-width">
            <span class="label">物品拍照:</span>
            <div v-if="detailInfo.depositImages && detailInfo.depositImages.length" class="image-list">
            <div v-if="detailInfo.orderFiles && detailInfo.orderFiles.length" class="image-list">
              <el-image
                v-for="(img, index) in detailInfo.depositImages"
                v-for="(img, index) in detailInfo.orderFiles"
                :key="index"
                style="width: 80px; height: 80px; margin-right: 10px"
                :src="img"
                :preview-src-list="detailInfo.depositImages"
                :preview-src-list="detailInfo.orderFiles"
                fit="cover"
              ></el-image>
            </div>
@@ -129,11 +131,11 @@
          </div>
          <div class="info-item">
            <span class="label">寄件地址:</span>
            <span class="value">{{ detailInfo.order.depositLocation || '' }}{{ detailInfo.order.depositLocationRemark || '' }}</span>
            <span class="value">{{ detailInfo.order.depositLocationRemark || '' }}</span>
          </div>
          <div class="info-item">
            <span class="label">收件地址:</span>
            <span class="value">{{ detailInfo.order.takeLocation || '' }}{{ detailInfo.order.takeLocationRemark || '' }}</span>
            <span class="value">{{ detailInfo.order.takeLocationRemark || '' }}</span>
          </div>
          <div class="info-item">
            <span class="label">是否收件服务点:</span>
@@ -145,19 +147,19 @@
          </div>
          <div class="info-item full-width">
            <span class="label">门店收件拍照:</span>
            <div v-if="detailInfo.storeInImages && detailInfo.storeInImages.length" class="image-list">
            <div v-if="detailInfo.depositImages && detailInfo.depositImages.length" class="image-list">
              <el-image
                v-for="(img, index) in detailInfo.storeInImages"
                v-for="(img, index) in detailInfo.depositImages"
                :key="index"
                style="width: 80px; height: 80px; margin-right: 10px"
                :src="img"
                :preview-src-list="detailInfo.storeInImages"
                :preview-src-list="detailInfo.depositImages"
                fit="cover"
              ></el-image>
            </div>
            <span v-else>-</span>
          </div>
          <div class="info-item full-width">
          <div class="info-item full-width" v-if="detailInfo.order && detailInfo.order.type===1">
            <span class="label">司机取件拍照:</span>
            <div v-if="detailInfo.driverTakeImages && detailInfo.driverTakeImages.length" class="image-list">
              <el-image
@@ -171,8 +173,22 @@
            </div>
            <span v-else>-</span>
          </div>
          <div class="info-item full-width">
            <span class="label">司机送达拍照/门店入库拍照:</span>
          <div class="info-item full-width" v-if="detailInfo.order && detailInfo.order.type===1 && detailInfo.order.takeShopId">
            <span class="label">门店入库拍照:</span>
            <div v-if="detailInfo.storeInImages && detailInfo.storeInImages.length" class="image-list">
              <el-image
                v-for="(img, index) in detailInfo.storeInImages"
                :key="index"
                style="width: 80px; height: 80px; margin-right: 10px"
                :src="img"
                :preview-src-list="detailInfo.storeInImages"
                fit="cover"
              ></el-image>
            </div>
            <span v-else>-</span>
          </div>
          <div class="info-item full-width" v-if="detailInfo.order && detailInfo.order.type===1 && !detailInfo.order.takeShopId">
            <span class="label">司机送达拍照:</span>
            <div v-if="detailInfo.driverDoneImages && detailInfo.driverDoneImages.length" class="image-list">
              <el-image
                v-for="(img, index) in detailInfo.driverDoneImages"
@@ -185,7 +201,7 @@
            </div>
            <span v-else>-</span>
          </div>
          <div class="info-item full-width">
          <div class="info-item full-width" v-if="detailInfo.order && detailInfo.order.takeShopId">
            <span class="label">门店出库拍照:</span>
            <div v-if="detailInfo.storeOutImages && detailInfo.storeOutImages.length" class="image-list">
              <el-image
@@ -202,7 +218,7 @@
        </div>
      </div>
      <div class="section">
      <div class="section" v-if="detailInfo.order.cancelTime">
        <div class="section-header">
          <span class="section-title">取消信息</span>
        </div>
@@ -235,7 +251,7 @@
          <div class="info-item">
            <span class="label">退款金额:</span>
            <span class="value">{{ detailInfo.ordersRefund.createTime || '-' }}</span>
            <span class="value">¥{{ (detailInfo.ordersRefund.refundAmount / 100).toFixed(2) || '-' }}</span>
          </div>
          <div class="info-item">
            <span class="label">退款处理时间:</span>
@@ -280,42 +296,44 @@
        <div class="section-header">
          <span class="section-title">物品信息</span>
        </div>
        <el-table :data="detailInfo.detailList" stripe class="goods-table">
        <el-table :data="detailInfo.detailList" stripe class="goods-table"    :header-row-style="headerRowStyle">
          <el-table-column prop="typeName" label="物品名称" min-width="80px"></el-table-column>
          <el-table-column prop="luggageName" label="物品尺寸" min-width="80px"></el-table-column>
          <el-table-column label="单价(元)" min-width="100px">
            <template slot-scope="{row}">
              ¥{{ (row.unitPriceYuan / 100).toFixed(2) }}
              ¥{{ ((row.unitPrice||0) / 100).toFixed(2) }}
            </template>
          </el-table-column>
          <el-table-column prop="num" label="数量" min-width="60px"></el-table-column>
          <el-table-column label="小计(元)" min-width="100px">
            <template slot-scope="{row}">
              ¥{{ (row.subtotal / 100).toFixed(2) }}
              <span class="yellowstate">  ¥{{ ((row.subtotal ||0) / 100).toFixed(2) }}</span>
            </template>
          </el-table-column>
        </el-table>
        <div class="price-summary">
          <span>基础服务费:¥{{ (detailInfo.order.price / 100).toFixed(2) }}</span>
          <span>物品保费:¥{{ (detailInfo.order.declaredFee / 100).toFixed(2) }}</span>
          <span>订单总价:¥{{ (detailInfo.order.totalAmount / 100).toFixed(2) }}</span>
          <span>实际支付:¥{{ (detailInfo.order.payAmount / 100).toFixed(2) }}</span>
          <span>退款金额:¥{{ (detailInfo.order.refundAmount / 100).toFixed(2) }}</span>
          <span>超时金额:¥{{ (detailInfo.order.overdueAmount / 100).toFixed(2) }}</span>
          <span>异常金额:¥{{ (detailInfo.order.exceptionAmount / 100).toFixed(2) }}</span>
        <div class="price-summary" v-if="detailInfo.order">
          <span class="price-span">基础服务费:¥{{ ((detailInfo.order.price||0) / 100).toFixed(2) }}</span>
          <span  class="price-span">物品保费:¥{{ ((detailInfo.order.declaredFee||0) / 100).toFixed(2) }}</span>
          <span  class="price-span">订单总价:¥{{ ((detailInfo.order.totalAmount||0) / 100).toFixed(2) }}</span>
          <span  class="price-span">实际支付:¥{{ ((detailInfo.order.payAmount||0) / 100).toFixed(2) }}</span>
          <span class="price-span">退款金额:¥{{ ((detailInfo.order.refundAmount ||0)/ 100).toFixed(2) }}</span>
          <span class="price-span">超时金额:¥{{ ((detailInfo.order.overdueAmount ||0)/ 100).toFixed(2) }}</span>
          <span class="price-span">异常金额:¥{{ ((detailInfo.order.exceptionAmount ||0)/ 100).toFixed(2) }}</span>
        </div>
      </div>
    </div>
    <orderProgress ref ='orderProgress'></orderProgress>
  </GlobalWindow>
</template>
<script>
import GlobalWindow from '@/components/common/GlobalWindow'
import { getById } from '@/api/business/orderManagement'
import { getById ,logListPage} from '@/api/business/orderManagement'
import orderProgress from '@/components/business/orderProgress'
export default {
  name: 'OperaOrderDetail',
  components: { GlobalWindow },
  components: { GlobalWindow ,orderProgress},
  data () {
    return {
      title: '订单详情',
@@ -324,6 +342,13 @@
    }
  },
  methods: {
    headerRowStyle({ rowIndex }) {
      return {
        background:   '#007bff' ,
        color : '#333',
        height: '50px'
      }
    },
    open (row) {
      this.title = '订单详情'
      getById(row.id).then(res => {
@@ -333,6 +358,27 @@
      }).catch(e => {
        this.$tip.apiFailed(e)
      })
    },
    showLogList () {
      var that = this
      if (!this.detailInfo.order || !this.detailInfo.order.id) {
        return
      }
      logListPage({
        capacity: 10000,
        model: {
          orderId: this.detailInfo.order.id
        },
        page: 1
      }).then(res => {
        var orderLogList = res.records || []
        if (orderLogList.length) {
          this.$refs.orderProgress.open('订单派单日志', orderLogList || [])
        } else {
          this.$message.warning('未查询到任何派单记录!')
        }
      }).catch(e => {
      })
    }
  }
}
@@ -340,7 +386,7 @@
<style scoped>
.order-detail {
}
.section {
  margin-bottom: 25px;
@@ -385,6 +431,7 @@
}
.goods-table {
  margin-bottom: 15px;
  border: 1px solid #f2f2f2;
}
.price-summary {
  display: flex;
@@ -395,5 +442,9 @@
  border-radius: 4px;
  font-size: 14px;
  color: #606266;
}
.price-span{
  width: 20%;
}
</style>