aiot-app/pages/repair/order/OrderTask.vue

<template>
  <view class="marginTop">
    <view
      class="list-wrap"
      v-for="(item, index) in list"
      :key="index"
      v-show="list.length !== 0"
      @click="goDetail(item.id)"
    >
      <view class="item">
        <view class="s1">
          <text class="title">{{ item.repairsCode }}</text>
        </view>
        <view class="s2">
          {{ item.createTime }}
        </view>
      </view>
      <view class="item">
        <view class="s1"> 设备名称：{{ item.equiName }} </view>
      </view>
      <view class="item">
        <view class="s1"> 设备编码:{{ item.equiCode }} </view>
      </view>
      <view class="item">
        <view class="s1"> 故障描述:{{ item.repairsDescription }} </view>
      </view>
      <view class="item">
        <view class="s1">
          <view class="state">
            {{ dict.status[item.status] }}
          </view>
        </view>
      </view>
    </view>
    <view v-show="list.length === 0" class="no_data">
      <u-empty mode="data"></u-empty>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    type: {
      type: [String, Number]
    },
    list: {
      type: Array,
      default: () => []
    }
  },
  data () {
    return {
      dict: {
        status: {
          0: '已报修',
          1: '待审核',
          2: '已派单',
          3: '执行中',
          4: '待验收',
          5: '已完成'
        },
        //紧急程度
        urgent: {
          1: '普通',
          2: '紧急',
          3: '重要'
        }
      }
    }
  },
  methods: {
    goDetail (id) {
      uni.navigateTo({
        url: '../detail/detail?id=' + id
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.marginTop {
  border-top: 20rpx solid $page-bg;
  padding-bottom: 80rpx;
}

.center {
  text-align: center;
  margin-bottom: 10rpx;
  color: #999;
}

.no_data {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #999;
  font-size: 28rpx;
}

.list-wrap {
  padding: 10rpx;
  .item {
    display: flex;
    justify-content: space-between;
    padding: 10rpx;
    color: rgb(170, 170, 170);
    font-size: 28rpx;
    word-break: break-all;
    .title {
      color: #333333;
      font-size: 28rpx;
    }
    .state {
      font-size: 12px;
      color: #7f7f7f;
      background: #f1f1f1;
      display: inline;
      padding: 2px 5px;
      border-radius: 10px;
    }
  }

  & + .list-wrap {
    border-top: 1px solid rgba(242, 242, 242, 1);
  }
}
</style>