vehInfo.vue 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. <template>
  2. <u-popup :show="isShow" @close="close" :closeOnClickOverlay="false" :overlay="false" :closeable="true">
  3. <view class="container">
  4. <u--form label-width="auto" labelAlign="right"
  5. :labelStyle="{
  6. fontSize: '28rpx',
  7. fontWeight: '700',
  8. }"
  9. >
  10. <u-row>
  11. <u-col :span="8" v-if="tabStyle == 'vehicle'">
  12. <u-form-item label="车牌号:" >
  13. {{renderItem(item,'plate','--')}}
  14. </u-form-item>
  15. </u-col>
  16. <u-col :span="8" v-if="tabStyle == 'personnel'">
  17. <u-form-item label="人员:" >
  18. {{renderItem(item,'name','--')}}
  19. </u-form-item>
  20. </u-col>
  21. <u-col :span="4">
  22. <u-form-item label="速度:" >
  23. {{renderItem(item,'speed','--')}}km/h
  24. </u-form-item>
  25. </u-col>
  26. </u-row>
  27. <u-form-item label="方向:" v-if="tabStyle == 'vehicle'">
  28. {{judgingDirectionAngle(renderItem(item,'direction'))}}
  29. </u-form-item>
  30. <u-form-item label="时间:" >
  31. {{renderItem(item,'gpsTime','--')}}
  32. </u-form-item>
  33. <u-form-item label="位置:" >
  34. {{renderItem(item,'location','--')}}
  35. </u-form-item>
  36. </u--form>
  37. </view>
  38. </u-popup>
  39. </template>
  40. <script>
  41. import {isArray,clone,isObject } from 'lodash'
  42. import {getImages} from '@/plugins/images'
  43. import {copyProps,clearProps,judgingDirectionAngle} from '@/utils/gdtq.js'
  44. export default {
  45. props: {
  46. item: {
  47. type: Object,
  48. default: () => {}
  49. }
  50. },
  51. data() {
  52. return {
  53. isShow: false,
  54. judgingDirectionAngle,
  55. }
  56. },
  57. computed: {
  58. tabStyle() {
  59. return this.$store.state.pastRoute.tabStyle
  60. }
  61. },
  62. mounted() {
  63. },
  64. methods: {
  65. show(e) {
  66. setTimeout(() => {
  67. this.isShow= true;
  68. },50)
  69. },
  70. close() {
  71. this.isShow = false
  72. },
  73. }
  74. }
  75. </script>
  76. <style lang="scss" scoped>
  77. .container {
  78. background: #fff;
  79. padding: 60rpx 0 0 20rpx;
  80. font-size: 28rpx;
  81. min-height: 360rpx;
  82. }
  83. </style>