baseInfoTab.vue 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. <template>
  2. <div class="baseinfo">
  3. <el-descriptions
  4. class="margin-top"
  5. title=""
  6. :column="4"
  7. direction="horizontal"
  8. >
  9. <el-descriptions-item :label="$t('orderCode')">{{
  10. orderInfo.ordersId
  11. }}</el-descriptions-item>
  12. <el-descriptions-item :label="$t('orderStatus')">{{
  13. orderInfo.status | statusFilter
  14. }}</el-descriptions-item>
  15. <el-descriptions-item :label="$t('netShopOC')">{{
  16. orderInfo.ormorder
  17. }}</el-descriptions-item>
  18. <el-descriptions-item :label="$t('orderType')">{{
  19. orderInfo.orderType | orderTypeFilter
  20. }}</el-descriptions-item>
  21. </el-descriptions>
  22. <el-descriptions
  23. class="margin-top"
  24. title=""
  25. :column="4"
  26. direction="horizontal"
  27. >
  28. <el-descriptions-item :label="$t('takeOrderTime')">{{
  29. orderInfo.timeplaced
  30. }}</el-descriptions-item>
  31. <el-descriptions-item :label="$t('payTime')">{{
  32. orderInfo.payTime
  33. }}</el-descriptions-item>
  34. <el-descriptions-item :label="$t('currency')">{{
  35. orderInfo.currency
  36. }}</el-descriptions-item>
  37. <el-descriptions-item :label="$t('payways')">{{
  38. orderInfo.paytype
  39. }}</el-descriptions-item>
  40. </el-descriptions>
  41. <el-descriptions
  42. class="margin-top"
  43. title=""
  44. :column="4"
  45. direction="horizontal"
  46. >
  47. <el-descriptions-item :label="$t('goodsAmount')">{{
  48. orderInfo.discountTotal + orderInfo.payment
  49. }}</el-descriptions-item>
  50. <el-descriptions-item :label="$t('shipMoney')">
  51. {{ orderInfo.totalShipping }}</el-descriptions-item
  52. >
  53. <el-descriptions-item :label="$t('shouldPay')">{{
  54. orderInfo.payment
  55. }}</el-descriptions-item>
  56. <el-descriptions-item :label="$t('offerAmount')">{{
  57. orderInfo.discountTotal
  58. }}</el-descriptions-item>
  59. </el-descriptions>
  60. <el-descriptions
  61. class="margin-top"
  62. title=""
  63. :column="4"
  64. direction="horizontal"
  65. >
  66. <el-descriptions-item :label="$t('sellerDiscount')">{{
  67. orderInfo.sellerDiscount
  68. }}</el-descriptions-item>
  69. <el-descriptions-item :label="$t('platformDiscount')">
  70. {{ orderInfo.platformDiscount }}</el-descriptions-item
  71. >
  72. <el-descriptions-item :label="$t('loanAmount')">{{
  73. orderInfo.loanAmount
  74. }}</el-descriptions-item>
  75. </el-descriptions>
  76. <el-descriptions
  77. class="margin-top"
  78. title=""
  79. :column="4"
  80. direction="horizontal"
  81. >
  82. <el-descriptions-item :label="$t('buyerRemark')">{{
  83. orderInfo.buyerNote
  84. }}</el-descriptions-item>
  85. <el-descriptions-item :label="$t('sellerRemark')">{{
  86. orderInfo.sellerNote
  87. }}</el-descriptions-item>
  88. <el-descriptions-item :label="$t('inRemark')">{{
  89. orderInfo.note
  90. }}</el-descriptions-item>
  91. </el-descriptions>
  92. </div>
  93. </template>
  94. <script>
  95. import { orderTypeKeyValue, statusKeyValue } from "@/api/oms/order/order";
  96. import i18n from "@/lang"; // 国际化
  97. export default {
  98. name: "baseInfoTab",
  99. props: ["orderInfo"],
  100. filters: {
  101. orderTypeFilter(key) {
  102. return i18n.t(orderTypeKeyValue[key]);
  103. },
  104. statusFilter(key) {
  105. return i18n.t(statusKeyValue[key]);
  106. }
  107. },
  108. data() {
  109. return {};
  110. },
  111. methods: {}
  112. };
  113. </script>
  114. <style lang="scss" scoped>
  115. .ptitle {
  116. display: flex;
  117. justify-content: space-between;
  118. margin: 0px 20px 0px 20px;
  119. color: #1f2d3d;
  120. text-align: left;
  121. font-weight: bold;
  122. }
  123. </style>