p-personnel-orientation-section-1.vue 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. <template>
  2. <view>
  3. <view class="content">
  4. <view class="title">
  5. 当前井下人员
  6. </view>
  7. <view class="inner">
  8. <slot></slot>
  9. </view>
  10. <!-- 当前下井领导 -->
  11. <view class="list" v-if="people_list.length > 0">
  12. <view class="label">
  13. <view class="text box_1">姓名</view>
  14. <view class="text box_2">下井时间</view>
  15. <view class="text box_3">当前位置</view>
  16. </view>
  17. <view class="item" v-for="(item,index) in people_list" :key="index" @click="go_downhole_statistics(item.people_num,item.depart_name,item.name)">
  18. <view class="text box_1">{{item.name}}</view>
  19. <view class="text box_2">{{item.down_time}}</view>
  20. <view class="text box_3">{{item.station_name}}</view>
  21. </view>
  22. </view>
  23. </view>
  24. </view>
  25. </template>
  26. <script>
  27. export default {
  28. props: ['mine'],
  29. data() {
  30. return {
  31. // mine:"",
  32. people_list: [],
  33. }
  34. },
  35. watch: {
  36. // mine: function(newVal, oldVal) {
  37. // this.mine = newVal
  38. // console.log(newVal)
  39. // }
  40. },
  41. created() {
  42. this.$p_api.personnel_people_now({
  43. mine: this.mine
  44. }).then((res) => {
  45. console.log(res)
  46. this.people_list = res.data.data.people_list
  47. })
  48. },
  49. methods:{
  50. go_downhole_statistics(people_num,depart_name,name){
  51. uni.navigateTo({
  52. url:"./downhole_statistics/downhole_statistics?people_num="+people_num+"&depart_name="+depart_name+"&name="+name+"&mine="+this.mine
  53. })
  54. }
  55. }
  56. }
  57. </script>
  58. <style lang="scss">
  59. .content {
  60. margin-top: 16rpx;
  61. background: #FFFFFF;
  62. box-shadow: 0px 3rpx 29rpx 0px rgba(59, 74, 116, 0.14);
  63. border-radius: 20rpx;
  64. .title {
  65. line-height: 96rpx;
  66. text-align: center;
  67. font-size: 30rpx;
  68. font-family: PingFangSC-Regular, PingFang SC;
  69. font-weight: 400;
  70. color: #232627;
  71. border-bottom: 2rpx solid #f3f3f3;
  72. }
  73. .inner {
  74. // height: 500px;
  75. }
  76. }
  77. .list {
  78. padding: 0 10rpx;
  79. .label {
  80. display: flex;
  81. align-items: center;
  82. height: 82rpx;
  83. background: #F3F6FA;
  84. .text {
  85. text-align: center;
  86. font-size: 27rpx;
  87. font-family: PingFangSC-Regular, PingFang SC;
  88. font-weight: 400;
  89. color: #232627;
  90. overflow: hidden;
  91. white-space: nowrap;
  92. text-overflow: ellipsis;
  93. }
  94. .box_1 {
  95. width: 150rpx;
  96. }
  97. .box_2 {
  98. width: 150rpx;
  99. }
  100. .box_3 {
  101. text-align: right;
  102. width: 400rpx;
  103. padding-right: 15rpx;
  104. }
  105. }
  106. .item {
  107. display: flex;
  108. align-items: center;
  109. height: 82rpx;
  110. .text {
  111. text-align: center;
  112. font-size: 27rpx;
  113. font-family: PingFangSC-Regular, PingFang SC;
  114. font-weight: 400;
  115. color: #232627;
  116. overflow: hidden;
  117. white-space: nowrap;
  118. text-overflow: ellipsis;
  119. }
  120. .box_1 {
  121. width: 150rpx;
  122. }
  123. .box_2 {
  124. width: 150rpx;
  125. }
  126. .box_3 {
  127. text-align: right;
  128. width: 400rpx;
  129. padding-right: 15rpx;
  130. }
  131. }
  132. }
  133. </style>