dachexingcheng.vue 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. <template>
  2. <view >
  3. <view class="contentColumnC" style="width: 700rpx;background-color: white;">
  4. <view style="height: 20rpx;"></view>
  5. <view v-if="weizhifu!=0" class="contentInRowS noteCtView" @click="actIndex(0)">
  6. <text style="color: white;font-size: 32rpx;margin-left: 10rpx;">您有订单未完成支付!</text>
  7. <uni-icons custom-prefix="custom-icon" color="white" type="right" size="24"></uni-icons>
  8. </view>
  9. <view class="contentInRowS" style="width:660rpx;align-items: center;">
  10. <view class="contentInRowL" style="align-items: center;">
  11. <text style="width: 20rpx;height: 20rpx;border-radius: 10rpx;background-color:#65AB91;"></text>
  12. <view class="contentColumn" style="width: 580rpx;">
  13. <text class="staddrtext">{{XChengObj.boardingAddress}}</text>
  14. <text style="color: #65AB91;font-size: 24rpx;margin-left: 10rpx;">当前位置</text>
  15. </view>
  16. </view>
  17. <uni-icons v-if="xiugai==0" custom-prefix="custom-icon" color="slateblue" type="refresh" size="32" @click="actIndex(1)"></uni-icons>
  18. </view>
  19. <view class="contentInRowL mudidiViewct">
  20. <view class="contentInRowL" style="align-items: center;">
  21. <text style="width: 20rpx;height: 20rpx;border-radius: 10rpx;background-color:#E86E48;"></text>
  22. <view class="contentColumn" style="width: 580rpx;">
  23. <text class="staddrtext" style="color: #E86E48;">{{XChengObj.downAddress}}</text>
  24. <text style="color: #E86E48;font-size: 24rpx;margin-left: 10rpx;">目的地</text>
  25. </view>
  26. </view>
  27. </view>
  28. <view v-if="XChengObj.distance!=''" class="contentInRowS" style="width:660rpx;align-items: center;">
  29. <text class="staddrtext">里程:{{XChengObj.distance}}Km</text>
  30. <text class="staddrtext" style="color: #E86E48;">预计用时:{{XChengObj.estimatedDuration}}</text>
  31. <text class="staddrtext" style="color:darkmagenta;">车费:{{XChengObj.amount}}元</text>
  32. </view>
  33. <view style="height: 20rpx;"></view>
  34. </view>
  35. <view class="contentColumnC" style="margin-top: 40rpx;">
  36. <text v-if="xiugai==0" class="actBTzhifu" @click="actIndex(2)">{{i18n('dache.woyaojiaoche')}}</text>
  37. <text v-if="xiugai==1" class="actBTzhifu" @click="actIndex(3)">{{i18n('dache.xiugaimudd')}}</text>
  38. </view>
  39. </view>
  40. </template>
  41. <script>
  42. export default {
  43. name:"dachexingcheng",
  44. props:{
  45. XChengObj:'',
  46. xiugai:0,
  47. weizhifu:0
  48. },
  49. data() {
  50. return {
  51. mudidi:'',
  52. mdaddr:'',
  53. };
  54. },
  55. methods:{
  56. i18n(str){
  57. return getApp().globalData.$t(str);
  58. },
  59. actIndex(index){
  60. this.$emit('EXCactSelect',index,'');
  61. },
  62. mdaddrinput(event){
  63. this.mdaddr = event.target.value;
  64. this.$emit('EXCactSelect',4,this.mdaddr);
  65. },
  66. },
  67. }
  68. </script>
  69. <style>
  70. .noteCtView{
  71. width: 660rpx;
  72. align-items: center;
  73. background-color: #E86E48;
  74. border-radius: 10rpx;
  75. margin-bottom: 20rpx;
  76. height: 60rpx;
  77. }
  78. .staddrtext{
  79. margin-left: 10rpx;
  80. font-size: 28rpx;
  81. color: #65AB91;
  82. }
  83. .mudidiViewct{
  84. width: 660rpx;
  85. align-items: center;
  86. margin-top: 20rpx;
  87. margin-bottom: 20rpx;
  88. }
  89. .noinputV{
  90. margin-left: 10rpx;
  91. margin-top: 10rpx;
  92. margin-bottom: 10rpx;
  93. width: 580rpx;
  94. height: 60rpx;
  95. background-color: #F2F4FF;
  96. border-radius: 8rpx;
  97. }
  98. .actBTzhifu{
  99. font-size: 30rpx;
  100. font-weight: bold;
  101. line-height: 60rpx;
  102. padding-left: 50rpx;
  103. padding-right: 50rpx;
  104. border-radius: 30rpx;
  105. color: white;
  106. background-color: #E86E48;
  107. margin-bottom: 16rpx;
  108. }
  109. </style>